removeChild method
The removeChild method allows
you to remove an element. It applies
to the parent element specifying
the element to be removed.
Syntax
parent.removeChild(element);
Example
Let's remove the #elem paragraph. To
do this, we get its parent #parent
and the removeChild method is applied
to the received parent, and the element we
want to remove is passed as the method
parameter:
<div id="parent">
<p id="elem">elem 1</p>
<p>elem 2</p>
</div>
let parent = document.querySelector('#parent');
let elem = document.querySelector('#elem');
parent.removeChild(elem);
The code execution result:
<div id="parent">
<p>elem 2</p>
</div>
Example
If you need to delete an element, but
there is no reference to its parent,
you can get the parent via
parentElement:
<div>
<p id="elem">elem 1</p>
<p>elem 2</p>
</div>
let elem = document.querySelector('#elem');
elem.parentElement.removeChild(elem);
The code execution result:
<div id="parent">
<p>elem 2</p>
</div>
See also
-
the
removemethod
that can be used to remove an element