CODEWITHSUNDEEP
javascriptjquery
user1553969
user1553969

Reputation: 43

How to detect the existence of an element in javascript?

var newHead = '<div id="head'+text+'"></div>';
var header = "head"+text;
if (document.getElementById(header) == undefined) {
        //alert(document.getElementById("head"+text));
        $("#result-job").append(newHead);
        var result = '<div id="div' + dataSplit[0] + '"><input type="radio" checked="checked" class="choosenJob" name="rdb_job" value="' + dataSplit[0] + '" id="' + dataSplit[0] + '" /><label for="' + dataSplit[0] + '">' + dataSplit[1] + '</label><br /></div>';
        $("div#" + header).append(result);
    } else {
        var result = '<div id="div' + dataSplit[0] + '"><input type="radio" checked="checked" class="choosenJob" name="rdb_job" value="' + dataSplit[0] + '" id="' + dataSplit[0] + '" /><label for="' + dataSplit[0] + '">' + dataSplit[1] + '</label><br /></div>';
        $("div#" + header).append(result);
    }

Can those script run well ? I want add some new element(div) in the result div but my script didnt work

fiddle simulation: http://jsfiddle.net/86kH4/5/

Upvotes: 1

Views: 170

Answers (6)

Dmitry Bolyukh
Dmitry Bolyukh

Reputation: 1

http://jsfiddle.net/Q98mv/ - Please compare your snippet with this one and you will find where problem was

$('#chk1').click(function(){
    var ada = "asd";  //ada here will be my dynamic parameters                 
    var neww= '<div id="baru'+ada+'"></div>';

    if($('#baru'+ada).length==0){
        $("#asd").append(neww);
    }else{
        $("#baru"+ada).append("Hellow<br>");
    }
})​;

Upvotes: 0

Nope
Nope

Reputation: 22329

Replace 

if (document.getElementById(header) == undefined) {

with

if ($("#" + header).length == 0) {

Upvotes: 2

Felix Kling
Felix Kling

Reputation: 816242

As I mentioned in my comment, your fiddle has a syntax error, that's why it "does not work". Once you fixed the error, you get the expected behaviour: http://jsfiddle.net/fkling/86kH4/28/.

Yes, you can use 

document.getElementById(header) == undefined

to test whether an element with the ID contain in header exists or not.

If no such element exists, getElementById will return null and null == undefined is true. With that in mind, it would be even more correct if you were comparing against null:

document.getElementById(header) === null

That said, since you are using jQuery, I would try to be consistent and not mixing it with plain DOM methods. Every jQuery object has a length property containing the number of selected elements. So the jQuery equivalent would be:

$('#' + header).length === 0

Upvotes: 0

xiaohigh
xiaohigh

Reputation: 26

here you should use a jquery function "live" for example:

$("div#" + header).live().append(result);

this function is used when the element was added appending the created elements~~ hope it is useful~~~

Upvotes: 0

Shreedhar
Shreedhar

Reputation: 5640

replace this if (document.getElementById(header) == undefined) { with if ($('#header') == undefined) { it may work fine. by the way you missed quotes for header in your code.

Upvotes: -1

zessx
zessx

Reputation: 68790

You must add some quotes around your id, and it'll works fine. Also, remove the == undefined, let just Javascript check it :

if (document.getElementById("header")) {
   /* treatment */
} else {
   /* treatment */
}

Upvotes: 0

Related Questions