Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Clinton Johnson
28,714 PointsRemove the list item element stored in firstListItem from the DOM.
can someone please explain and post the code answer to the question i have tried everything and i having a hard time understanding.
<!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>
let myList = document.querySelector('ul');
let firstListItem = document.querySelector('li');
firstListItem.remove();
6 Answers
Eduardo Parra San Jose
12,579 PointsHi,
Your code does what the challenge ask for. It removes the first li element from the unordered list. However to pass the challenge, you have to use the removeChild method instead of the remove method, So in order to pass the challenge, the last line of your code should be:
myList.removeChild(firstListItem);
The way I solved was:
// 1st task
let myList = document.querySelector('ul');
// 2nd task
let firstListItem = document.querySelector('li:first-child');
// 3rd task
myList.removeChild(firstListItem);
I hope it helps. Have a nice day
Fuad Muhammad
4,273 PointsJust give 'Best Answer' for Eduardo.
Nickolas Fuentes
14,016 PointsMan I almost had it all the way! The question to me is asking to remove the firstListItem li which is stored in the firstListItem. So I thought this!
firstListItem.removeChild('li:first-child');
Which is why even store it in there in the first place haha! But thanks for cleaning this one up!
Maikal Kumar
4,858 Pointsdocument.querySelector('li');
by default querySelector() selects first child only. so it will also work fine .
Paulo Costa
2,407 PointsI´ve done it following the .getElementsByTagName. It would be:
Challenge Task 1 of 3 Select the unordered list element and store it in the variable myList
You need to store the element in the list ul = Unordered List
let myList = document.getElementsByTagName('ul')[0];
Challenge Task 2 of 3 Select the first list item element and store it in the variable firstListItem
Pick up the first one: li = List Item
let firstListItem = document.getElementsByTagName('li')[0];
Challenge Task 3 of 3 Remove the list item element stored in firstListItem from the DOM.
Let´s remove the item:
myList.removeChild(firstListItem);
Mansor Almossa
Full Stack JavaScript Techdegree Student 2,525 Pointsthis works: var firstListItem = document.querySelector('li, .first');
Clinton Johnson
28,714 PointsClinton Johnson
28,714 PointsThank you Eduardo, that what i was missing was to set the the firstListItem as li:first-child and then remove it thank you for your explanation.