ScoRpion
ScoRpion

Reputation: 11474

How to remove a parent node with all its children

I am learning the basics of javascript. now it DOM and i am stuck here, How can i remove a parent node with all its chldren. eg say i have the html code like this.

<ul id ="parent">
    <li>Hi</li>
    <li>How</li>
    <li>Are</li>
    <li>You</li>
</ul>

i wand to delete the <ul> element with all its child <li> nodes. I tried it to do like this document.getElementById('parent').removeNode(true); but its not working. Can anyone help me here. ?

Upvotes: 4

Views: 29661

Answers (2)

Roman
Roman

Reputation: 10403

You need to get a handle to the ul element then ask its parent element to delete it by passing the ul handle the parent's removeChild method.

This is how you would do it without the jQuery framework:

var x = document.getElementById('parent');
x.parentNode.removeChild(x);

Of course if you used jQuery it would be simple like this:

$("#parent").remove();

Upvotes: 12

hungneox
hungneox

Reputation: 9829

try this:

var childNode = document.getElementById("parent");
childNode.parentNode.removeChild(childNode);

Upvotes: 3

Related Questions