Remove table element inside parent TD Jquery

Question

I'm struggling to remove the table element inside the TD tag using jQuery.

Here is my Table structure:

<table>
   <tr>
       <td>some data</td>
       <td>
       <table><tr><td>this table inside I want to delete</td></tr></table>
       </td>
   </tr>
</table>

I want to use .remove() function in ready state function, but I don't know how.

Hussein Nazzal · Accepted Answer · 2013-10-03T11:18:18.683

4

i suppose the following will work :

$('td table').remove()

basically what this says is :

select the table , which is a child of a td .

so no matter how many tables in td's you have it will remove them all .

use an id or class name to furthermore define what you want to select .

edited Oct 03 '13 at 11:18

answered Oct 03 '13 at 11:07

Hussein Nazzal

2,557
18
35

1

This would remove all table elements contained in a td, everywhere. – Alex Oct 03 '13 at 11:12
well , thats what the OP asked for ! – Hussein Nazzal Oct 03 '13 at 11:13
no problem , but please take a look at the other answers .. as they are great way to learn . – Hussein Nazzal Oct 03 '13 at 11:14
Yes there are alot of options i could use then. – Onimax Oct 03 '13 at 11:17
what if there is a raw text after the td tag? it wont remove the other table on it – Onimax Oct 03 '13 at 11:38
it will remove the table .. but the text will be there – Hussein Nazzal Oct 03 '13 at 11:39
some data
this table inside I want to delete
this is the text before the table element

this data should be deleted also
I tried this one but no luck. the table is still there – Onimax Oct 03 '13 at 11:48
oh i just checked on it. it worked anyway.. i just missed the part.. im sorry. – Onimax Oct 03 '13 at 11:54

score 1 · Answer 2 · answered Oct 03 '13 at 11:13

1

try this

$(document).ready(function(){
     $('td table').remove();
});

answered Oct 03 '13 at 11:13

Kiranramchandran

2,094
16
30

score 0 · Answer 3 · answered Oct 03 '13 at 11:11

Give your table an Id like this

<table>
   <tr>
       <td>some data</td>
       <td>
       <table id="tableId"><tr><td>this table inside I want to delete</td></tr></table>
       </td>
   </tr>
</table>

Then you can pinpoint accurately your selector

$('#tableId').remove()

S. S. Rawat · Answer 4 · 2013-10-03T11:19:26.577

0

This will help you, here eq() are used to define which td you want to remove...

$('td').eq(0).find('table').remove();

Demo here

edited Oct 03 '13 at 11:19

answered Oct 03 '13 at 11:13

S. S. Rawat

5,943
4
43
59

score 0 · Answer 5 · edited May 23 '17 at 12:30

0

U can also use empty

$('td table').empty();

DEMO

Difference between using remove and empty

edited May 23 '17 at 12:30

Community

1
1

answered Oct 03 '13 at 11:18

Somnath Kharat

3,570
2
27
51

score 0 · Answer 6 · answered Oct 03 '13 at 11:22

0

$('td > table').remove();

this will only remove direct child of parent.

answered Oct 03 '13 at 11:22

Sandeep

69
5

Remove table element inside parent TD Jquery

6 Answers6