CODEWITHSUNDEEP
javascriptjquery
Patrioticcow
Patrioticcow

Reputation: 27038

how to remove dom elements with specific id's

i found that i can gram the id's like this:

var unic = $('div.hidde').find('li').map(function(i, v) { return this.id; }).get();
var unic1 = $('div.hi').find('li').map(function(i, v) { return this.id; }).get();

and i can combine them using this script:

var intersection = [];       
$(liList).each(function () {
    for (i in unic) {
        for (j in unic1) {
            if (unic[i] == unic1[j]) intersection.push(unic[i]);
        }
    }
});
alert(intersection);

another questions is how to remove the <li>'s with the id's returned by intersection ??

Upvotes: 2

Views: 3884

Answers (2)

T.J. Crowder
T.J. Crowder

Reputation: 1074198

If intersection is a list of IDs, it's really simple.

Using straight DOM methods (no jQuery), you can use getElementById to look up each element, parentNode to get its parent node, and then removeChild to remove it:

var index;
for (index = 0; index < intersection.length; ++index) {
    elm = document.getElementById(intersection[index]);
    elm.parentNode.removeChild(elm);
}

But it's worth noting that jQuery works around bugs in IE6's and IE7's implementation of getElementById, so if you're already using jQuery, you may want to use it for this as well to get the advantage of those workarounds.

Or use jQuery's remove:

var index;
for (index = 0; index < intersection.length; ++index) {
    $("#" + intersection[index]).remove();
}

Or if you like, use jQuery's each with remove:

$.each(intersection, function(index, value) {
    $("#" + value).remove();
});

Update 2011/04/29: Or you can take advantage of Array#join to create a selector in the form #id1, #id2, #id3 and them remove them with one call:

$('#' + intersection.join(', #')).remove();

Update: There's some discussion of making sure that the elements are li elements. If you really need to do that, here are the three above, modified:

Straight DOM (added the if):

var index;
for (index = 0; index < intersection.length; ++index) {
    elm = document.getElementById(intersection[index]);
    if (elm.tagName === "LI") {
        elm.parentNode.removeChild(elm);
    }
}

jQuery options (literally just add "li" in front of "#" to say "the element with this ID, but only if it's a li"):

For loop:

var index;
for (index = 0; index < intersection.length; ++index) {
    $("li#" + intersection[index]).remove();
}

Using each:

$.each(intersection, function(index, value) {
    $("li#" + value).remove();
});

Update 2011/04/29: Using Array#join:

$('li#' + intersection.join(', li#')).remove();

Upvotes: 4

alex
alex

Reputation: 490183

intersection has a list of all ids present in both arrays.

$('li').filter(function() {
    return $.inArray(this.id, intersection) !== -1;
}).remove();

jsFiddle.

Upvotes: 4

Related Questions