Question

Why can’t I query an element that I just added via append()?

$('body').append('<div id="testing"></div>');
if($("#testing").length == 0)
    alert("WTF!  Testing div should be there!");

Is there some kind of layout that doesn’t happen until the JS finishes running or something?

How can I get around this? Is there some other method that I could call to create dom elements to work with right away?

Answer 1

I would look as to where this code is being executed. Is this being run with a jQuery(document).ready() function block? I can’t see your full code.

When I run into stuff like this, it’s usually because my code is executing before the dom is ready. Please try this:

jQuery(document).ready(function(){
    $('body').append('<div id="testing"></div>');
    if($("#testing").length == 0){
        alert("WTF!  Testing div should be there!");
    }
});