I create an element dynamically:
var $el = $('<div class="someclass"></div>');
I want to append the element ($el) somewhere, but it shouldn't have an id.
How do I know if it has been appended before or not?
edit
I thought this should work
if($($el, "#target").length == 0)
$("#target").append($el);
but that was wrong
You can simply check to see if it has a parent:
var $el = $('<div class="someclass"></div>');
//Code you wrote that may or may not attach it to the DOM
if($el.parent().length === 0) {
//The element has not been added to the DOM because it doesn't not have a parentNode
}
However, if you have no idea what is actually being done with the element, you may have other problems with your code.
If I understand, and you need to check if another <div class='someclass'> already exists before appending $el, you can do:
if ($("div.someclass").length === 0) {
// it has not been created yet, create a new one
var $el = $('<div class="someclass"></div>');
}
To check if it is already a child node of some other element, use .find()
if ($("#parentNode").find("div.someclass").length === 0 {
// it has not been created yet, create a new one
var $el = $('<div class="someclass"></div>');
}
.someclass class may be used for other element, i just want to perform a check about this element with the same class.
.find("div.someclass")someclass in containerid attribute to find a more specific element.If I understand you correctly, you wish to find whether this exact element is already in the DOM, rather than some other arbitrary element that happens to have the same class.
If so, I believe this will work.
First, get the originally created element as an HTMLElement object rather than a jQuery object:
var el = $el.get(0);
then try to .find() it in the doc:
var $match = $(document).find(el);
var found = ($match.length > 0);
this won't be efficient, though - restrict the selector document to a narrower part of your DOM if you can!
Your edit suggests you could use #target as that selector.
.find(element) requires jQuery 1.6 or later
$el and that he needs to know later whether that is indeed the case.If you only want one element, you should really be using an ID with the element, and then checking for it in a similar way to how Michael has above. using
var el = $('<div id="someID" class="someClass" />');
I'm also not sure why you are using $el instead of just el
$el is a convention some programmers use to indicate that the variable is a jQuery object and not a native element. It reminds them that they needn't write $($el).method() and can just write $el.method() instead.
var $el = $("<div>").addClass("someclass");var $el = $('<div>', { 'class': 'someClass'} );