CODEWITHSUNDEEP
jquery
Hortitude
Hortitude

Reputation: 14058

jquery remove behavior

I have the following html

<div class="foobar"> 
  <div> child 1 </div>
  <div> child 2 </div>
  <ul>
    <li> list elem 1 </li>
    <li> list elem 2 </li>
    <li> list elem 3 </li>
  </ul>
</div>

When I try the following jquery the list is removed as expected:

$(".foobar ul").remove();

However when I try this, it does not seem to work:

$(".foobar").remove("ul");

Just trying to understand....

Upvotes: 0

Views: 298

Answers (2)

Adam
Adam

Reputation: 623

This would also work, although in your example there's no reason to write it this way - just extra code.

$(".foobar").children("ul").remove();

This would be helpful if you had other "ul"s that were further down the DOM tree and you only wanted to remove the immediate child element.

Upvotes: 1

Cokegod
Cokegod

Reputation: 8434

The remove method does not remove the elements inside that match the selector, it removes the elements in the group that match the selector. For example, this will remove the first and the third div:

<div class="remove">jquery</div>
<div>remove</div>
<div class="remove">test</div>

JavaScript:

$('div').remove('.remove');

Actually, having the selector inside the remove is pretty much useless, because you can also do:

$('div.remove').remove();

And the same thing will happen.

Upvotes: 5

Related Questions