Saturday 8 June 2013

Changed HTML, now child inputs are not accessible in each()

I think the problem is more fundamental with manipulating the DOM, but don't know how to verify.
So I've dynamically created tabs then added its corresponding div HTML using the HTML from another static tab div like so, which works great:
    $('#specific-tab').html($(this).closest('div').html() );
//where this is always one line away from closest('div') to copy from, promise.
Then later, I have one each statement which goes through all input text boxes within all tabs:
$('#div-above-tabs input[data-item=specialvalue]').each(function() {
   $(this).change(function() {
    //do stuff
   });
});
This statement works perfectly on all tabs EXCEPT the dynamically created ones.
I've spent 8 hours verifying all referenced attributes, ids, classes and they are PERFECT and uniquely identified.
Is there a behavior with the DOM using these methods that I don't know about?
EDIT
The first snippet occurs on a change() trigger. The second occurs without a trigger, but is written much later in the code. Relevant?

No comments:

Post a Comment