Reputation: 251
Hi i have a requirement in which i want to delete a particular table row inside div, the structure is as follows
<div id='Dictionary0'>
<div id='dept'>
<table id ='books'>
<tr id = 'row1'><td>..</td>
<tr id = 'row1'><td>..</td>
..
..
</tr>
</table>
</div>
</div>
<div id='Dictionary1'>
<div id='dept'>
<table id ='books'>
<tr id = 'row1'><td>..</td>
<tr id = 'row1'><td>..</td>
..
..
</tr>
</table>
</div>
</div>
i want to delete the rows with id row1 which are present inside Dictionary1 div , i used below command
$('#Dictionary1).find('#row1').remove();
this is not working. can anyone tell me what is the right way to achieve this
Upvotes: 1
Views: 172
Reputation: 176
you can remove elements like this
var element = document.getElementById("element-id"); element.parentNode.removeChild(element);
or document.getElementById("my-element").remove();
Upvotes: 0
Reputation: 28722
Try adding a quote
$('#Dictionary1').find('#row1').remove();
Your #Dictionary1 was missing a quote
Upvotes: 0
Reputation: 757
An id should only be used once within a document. If you are planning on having the same identifier more than once, you should use classes.
<div id='Dictionary0'>
<div id='dept'>
<table id ='books'>
<tr class = 'row1'><td>..</td>
<tr class = 'row1'><td>..</td>
..
..
</tr>
</table>
</div>
</div>
<div id='Dictionary1'>
<div id='dept'>
<table ='books'>
<tr class = 'row1'><td>..</td>
<tr class = 'row1'><td>..</td>
..
..
</tr>
</table>
</div>
</div>
Using this approach you can then delete all the elements with the row1 class with the following code:
$('#Dictonary1 .row1').remove();
Upvotes: 3