CODEWITHSUNDEEP
javascriptjquery
JoeGeeky
JoeGeeky

Reputation: 3796

JQuery selectors do not find objects added via append

Long after a page has loaded (e.g. a minute or more), we can receive push messages which would cause us to append new content. After doing this when we query using Jquery hash selector it never returns the newly added content. In all cases, the length is always zero. We can see the content, but the selector returns nothing.

var section = '<section id="NewSection">Hello</section>';
$('.container').append(section);

if ($('#NewSection').length == 0)
{
    alert('This should not be zero at this point... Why is it?');
}

Is there something we need to do in order to enable JQuery to find the appended content after it is appended?

Upvotes: 0

Views: 79

Answers (1)

josegomezr
josegomezr

Reputation: 916

Thou shall not cast when not necesairly.

You're casting to boolean using !, See this cold run:

len = $('#NewSection').length

CASE len = 0 then !len = true

if(1){
    // code excecutes
}

CASE len = 1 then !len = false

if(0){
    // no code executes
}

In order work, you should rework your condition.

// @updated!
var section = '<section id="NewSection">Hello</section>';
$('.container').append(section);
if ($('#NewSection').length > 0) // meaning one or MORE than one element got selected
{
    alert('I should have found this!');
}

Here is a jsfiddle

Upvotes: 1

Related Questions