Question

According to here, jquery’s remove function should work like so..

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

Which I’m trying in this example.

HTML:

<div class="wrapper">
    <p class="unwanted">This should be removed</p>
    <p class="retained">This will remain</p>
</div>​

JavaScript:

jQuery(document).ready(function($) {
    $('div').remove('p.unwanted'); //not working
    //$('p.unwanted').remove(); //this works
});

​
It’s not working. What am I doing wrong?

Answer 1

You’ve misunderstood what the documentation is saying. It’s not looking for elements that are descendants of the matched elements that match the selector, it’s simply filtering down the set of already matched elements to those that match the selector, and then removing them.

If you have this HTML:

<div class="wanted">Some text</div>
<div class="wanted">Some more text</div>
<div class="unwanted">Some unwanted text</div>

and then executed this jQuery:

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

then it would only remove that third <div> (the one with the unwanted class on it), because it first selects all <div> elements, and then only removes those that match the selector.

Example jsFiddle