ChildNode.remove

The ChildNode.remove() method removes the object from the tree it belongs to.

Syntax

node.remove(); 

Example

Using remove()

<div id="div-01">Here is div-01</div>
<div id="div-02">Here is div-02</div>
<div id="div-03">Here is div-03</div>

var el = document.getElementById('div-02');
el.remove(); // Removes the div with the 'div-02' id

ChildNode.remove() is unscopable

The remove() method is not scoped into the with statement. See Symbol.unscopables for more information.

with(node) { 
  remove();
}
// ReferenceError: remove is not defined 

Polyfill

You can polyfill the remove() method in Internet Explorer 9 and higher with the following code:

// from:https://github.com/jserz/js_piece/blob/master/DOM/ChildNode/remove()/remove().md
(function (arr) {
  arr.forEach(function (item) {
    if (item.hasOwnProperty('remove')) {
      return;
    }
    Object.defineProperty(item, 'remove', {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function remove() {
        if (this.parentNode !== null)
          this.parentNode.removeChild(this);
      }
    });
  });
})([Element.prototype, CharacterData.prototype, DocumentType.prototype]);

Specifications

Browser compatibility

[1] IE supports the non-standard removeNode(bool) function, where the bool argument indicates whether the child nodes of the given element should also be removed. MSDN: removeNode

See also

• The ChildNode pure interface.
• Object types implementing this pure interface: CharacterData, Element, and DocumentType.