Checking whether an element exists before proceeding to add an element

Question

I wish to add a select list under the first 'li' of my list.

It works with this method.

$("ul.criteriallist li:eq(0)").html("<select name='cao1' class='cao ops'></select>" 
+ $("ul.criteriallist li:eq(0)").html());

However, there's also another case where I would like to check whether the select list already exists within the 'li' item (to prevent adding duplicates). Do you have any recommendation on how I can do that?

What I'm thinking is something like.. (some pseudo code here..)

//If select list 'cao1' does not exist in this list item 

       // Add select list in this item

score 1 · Answer 1 · answered Dec 10 '13 at 08:09

1

You can try this:

if($('ul.criteriallist li:first-child select').length == 0) {
//code to add dropdownlist
}

answered Dec 10 '13 at 08:09

Milind Anantwar

79,642
23
92
120

score 1 · Accepted Answer · answered Dec 10 '13 at 08:10

1

You can use:

if($('ul.criteriallist li:eq(0) select[name="cao1"]').length === 0) {
    // add it
}

answered Dec 10 '13 at 08:10

techfoobar

63,712
13
108
129

Thanks, this works. May I check whether how come we're using '===' instead of '=='? – kosherjellyfish Dec 10 '13 at 08:16
Check this: http://stackoverflow.com/questions/359494/does-it-matter-which-equals-operator-vs-i-use-in-javascript-comparisons – techfoobar Dec 10 '13 at 08:18

score 0 · Answer 3 · answered Dec 10 '13 at 08:10

0

Try:

if(!(("ul.criteriallist li:eq(0)").find("select").length)){
    $("ul.criteriallist li:eq(0)").prepend("<select name='cao1' class='cao ops'></select>"); 
}

answered Dec 10 '13 at 08:10

codingrose

15,345
11
37
58

Checking whether an element exists before proceeding to add an element

3 Answers3