JavaScript JavaScript and the DOM Making Changes to the DOM Removing an Element from the DOM

Brendan Dzeguze
seal-mask
.a{fill-rule:evenodd;}techdegree
Brendan Dzeguze
Front End Web Development Techdegree Student 7,877 Points

how do i remove an element from firstListItem?

I thought i could use removeElement to remove it from firstListItem, but it is not working. Can someone help?

app.js
var myList = document.getElementsByTagName('ul')[0];
var firstListItem = document.getElementById("first");
firstListItem.remove();
index.html
<!DOCTYPE html>
<html>
    <head>
        <title>DOM Manipulation</title>
    </head>
    <link rel="stylesheet" href="style.css" />
    <body>
        <ul>
            <li id="first">First Item</li>
            <li id="second">Second Item</li>
            <li id="third">Third Item</li>
        </ul>
        <script src="app.js"></script>
    </body>
</html>

2 Answers

Jassim Al-Hatem
Jassim Al-Hatem
12,367 Points

Hi Brendan Dzeguze,

This is the solution.

var myList = document.getElementsByTagName('ul')[0];
var firstListItem = document.getElementById("first");
myList.removeChild(firstListItem);

Check out MDN for a detailed explaination of the method. or w3schools it's not as detailed but it's still very good.

Robert Manolis
seal-mask
STAFF
.a{fill-rule:evenodd;}techdegree
Robert Manolis
Treehouse Guest Teacher

Hi Brendan, the challenge is looking for a specific technique. On that third step in the challenge, if you click on the linked word "Remove" in the challenge instructions, it leads to an MDN page that details the specific method and technique you should use to pass that challenge.

So what you want there is the parent element, followed by the .removeChild() method, with the child to remove being passed into the method.

Hope that helps. :thumbsup: