This is because the .each()
loops through the matched elements when it was run...the new elements weren't there to do things to when you called it. Solution: call it again, but only for the new elements when you add them. You need to call the same .each()
on your ajax result, with the context of the result to restrict the each to it.
For example if you have this currently:
$(".myDiv").each(function() {
//stuff here
});
You need to call the same selector and same code in your success (or complete, whatever you're using) ajax function like this:
success: function(resp) {
$(".myDiv", resp).each(function() { //each, but only on the new guys
//stuff here (same as before)
});
//Do more stuff with your response...
}
The key here is the , resp
bit, it tells jQuery to select the same elements you were before, but only inside the context in the second parameter, in this case: your ajax response containing the new elements that need love.
Update based on new question code
First, you can shorten your code here (optional not required):
$('#chk-selected').change(function(){
if($(this).is(':checked')) {
$(".lib-item.item-selected").slideDown('fast');
}
else {
$(".lib-item.item-selected").slideUp('fast');
}
});
In the callback, trigger the that same handler to run again (this won't change the selection, just trigger the handler to run):
onComplete: function(event, queueID, fileObj, response, data)
{
$(".blank").remove();
$("#lib-contentWrap").append(response);
$('#chk-selected', response).trigger('change');
}