I need to remove a single tag from the DOM using jQuery or JavaScript. I only need to remove the enclosing tag, not the content inside the tag.
remove()
, detach()
, empty()
methods cannot be applied as they remove the whole content as well.
for example:
<table border="1" style="width:300px">
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
need to remove only the <table></table>
.
Currently DOM looks like this
<table style="width:600px">
<tbody><p> Number - Name - <br></p>
<p> 111 - ABC - <br></p>
<p> 222 - KLM - <br></p>
<p> 333 - NOP - <br></p>
<p> 444 - HIJ - <br></p>
</tbody></table>
Thank you in advance.
var table = document.querySelector("table"); table.outerHTML = table.innerHTML;
<tr>
and<td>
being removed as well, how about using the .text() method to extract the text and then replace in a paragraph? Is that the intent? It would be useful if you included what your desired resulting DOM would be.