JavaScript Code

How to remove first item from list element in document using JavaScript?

Tutorials using JS

Remove first item from List

Given a list element in HTML document, remove the first item from the list element, using JavaScript


To remove the first list-item from the given list element in the document, use Element.removeChild() method. Call removeChild() method on the list element, and pass the first list-item as argument to the method.

//get the list element
const list = document.getElementById("myList");

//remove the first list-item


In the following HTML code, we have a list element #myList. When user clicks on the button Click Me, we will remove the first list-item <li>apple</li> from the list element.

<!DOCTYPE html>
<h1>JavaScript Tutorial</h1>
<h2>Remove first list-item from list element</h2>
<button id="myBtn">Click me</button><br>
<ul id="myList">

//set onclick listener for #myBtn
document.getElementById("myBtn").addEventListener("click", function() {
    //get the list element
    const myList = document.getElementById("myList");

    //remove first list-item from list element


Copyright @2022