Remove the first <li> element from a list.
The <li> elements inside <ul> are not indented.
If they were, the first child node of <ul> would be a text node
Click the button to remove the first item from the list.
<!DOCTYPE html> <html> <body> <ul id="myList"><li>CSS</li><li>HTML</li><li>Java</li></ul> <button onclick="myFunction()">Test</button> <script> function myFunction() {/*from ww w. j a v a 2s . co m*/ var list = document.getElementById("myList"); list.removeChild(list.childNodes[0]); } </script> </body> </html>
The removeChild() method removes a specified child node of the specified element.
The removeChild() method returns the removed node as a Node object, or null if the node does not exist.
The removed child node is no longer part of the DOM.
We can use the appendChild() or insertBefore() method to insert the removed node into the same document.
To insert it to another document, use the document.adoptNode() or document.importNode() method.
node.removeChild(node);
Parameter Values
| Parameter | Type | Description |
|---|---|---|
| node | Node object | Required. The node object you want to remove |
The removeChild() method return a Node object representing the removed node, or null if the node does not exist.