Remove dom element without knowing its parent?

javascript removechild
Matrym picture Matrym · Nov 26, 2009 · Viewed 37.9k times · Source

Is it possible to remove a dom element that has no parent other than the body tag? I know this would be easy with a framework like jquery, but I'm trying to stick to straight javascript.

Here's the code I've found to do it otherwise:

function removeElement(parentDiv, childDiv){
     if (childDiv == parentDiv) {
          alert("The parent div cannot be removed.");
     }
     else if (document.getElementById(childDiv)) {     
          var child = document.getElementById(childDiv);
          var parent = document.getElementById(parentDiv);
          parent.removeChild(child);
     }
     else {
          alert("Child div has already been removed or does not exist.");
          return false;
     }
}

Thanks!

Answer

Adam Hopkinson picture Adam Hopkinson · Nov 26, 2009

You should be able to get the parent of the element, then remove the element from that

function removeElement(el) {
el.parentNode.removeChild(el);
}

Update

You can set this as a new method on the HTMLElement:

HTMLElement.prototype.remove = function() { this.parentNode.removeChild(this); return this; }

And then do el.remove() (which will also return the element)

Related questions

javascript remove li without removing ul?

Is there any way to remove the li elements of a ul without also removing the ul? I can only seem to find this. var element = document.getElementById('myList'); element.parentNode.removeChild(element); But, this removes the ul. I'm hoping …

Read More
Remove an element from the DOM from reference to element only

This is either very simple or impossible. I know I can do this: var element = document.getElementById('some_element'); element.parentNode.removeChild(element); ...but it feels messy. Is there a tidier - and universally supported - way to do the …

Read More
Creating an element that can remove it self?

I'm building a lightbox as a school project, and I can't use jQuery. I've got an image. When you click it, Javascript makes a transparent div with the ID "overlay". I want the div to remove itself, or the parent …

Read More