Assign event to .hide(); element
<p>I have a couple of links that are <code>.hide();</code> on page load. These links are used to fire ajax events and I want to assign events to them.<br>
I tried assigning events in combination with page load but the links does not have any functionality when <code>.show();</code><br>
So my question is should I assign events on page load or in combination with <code>show();</code>?</p>

<pre><code>    $('.submit-reply-button').each(function(){
    $(this).click(function(e){
        e.preventDefault();
        var commentid = $(this).data('commentid');
        var reply = $(textarea.commentid).val();
        var filename = $('.mainimage').data('filename');
        var imgowner = $('.mainimage').data('imgowner');
        $.ajax({
            type: 'POST',
            url: '?category=addimgcomment',
            data: {
                "commentid" : commentid,
                "imgcomment" : reply,
                "filename" : filename,
                "imgowner" : imgowner
            },
            success: function(data){
                $(textarea.commentid).val("");
                $('.'+commentid+'subcomments').html(data);
            }
        });
        return false;
    });
});
</code></pre>

<p>Attached to a button tag which is in turn inside an element that is hidden on page load. So there are several buttons and all are .hide(); on page load. When they show up no event is fired when clicked.</p>
