Skip to main content Accessibility Feedback

Removing an element from the DOM with vanilla JS

Yesterday, I showed you how to inject elements into the DOM. Today, let’s look at how to remove them.

There are two ways to remove an element from the DOM with vanilla JS, and both are really easy. If you just want to hide the element with CSS (useful if you may bring it back at some point), you can use the style property.

var elem = document.querySelector('#some-element');
elem.style.display = 'none';

If you want to remove the element from the DOM entirely, you can use the removeChild() method.

var elem = document.querySelector('#some-element');
elem.parentNode.removeChild(elem);

Not bad, right?


🔥 Hot off the press! I just launched a new pocket guide. Learn how to build interactive web apps with vanilla JavaScript.

Have any questions or comments about this post? Email me at chris@gomakethings.com or contact me on Twitter at @ChrisFerdinandi.

Get Daily Developer Tips