Alex Guerin
Alex Guerin

Reputation: 2386

JQuery Remove() doesn't work

I have a DIV element inside another as follows:

<div id="filters">
    <div class="filterData">hello</div>
</div>

and I'm trying to remove the element:

$("#filters").remove('.filterData');

Problem is, it doesn't. I've tested on other elements on my page and it works. The thing is, I cannot append to it, show or hide it, use .empty. I've also changed it to be a DIV with 'filterData' as the ID and told JQuery to remove it but it refuses to...

Has anyone had a stuborn element like this before?

EDIT: I'm also trying to remove it inside a $(document).ready function so I have no idea.

Upvotes: 12

Views: 20178

Answers (2)

hellomello
hellomello

Reputation: 8597

Gaby is correct, you need to just use .remove() and not .remove('.filterData'). Or if you still want to keep your div, but just take out everything in there, you can use .empty()

$(".filterData").empty();

Upvotes: 3

Gabriele Petrioli
Gabriele Petrioli

Reputation: 196236

That is not how .remove() works

Use

$("#filters .filterData").remove();

If you use a selector as a parameter to remove it acts as a filter on the existing set, not as find..

So you could use $("#filters .filterData").remove(':first'); if you had many .filerData and wanted to remove the first.. (just an example)

Upvotes: 21

Related Questions