Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript JavaScript and the DOM (Retiring) Traversing the DOM Getting the First and Last Child

Birthe Vandermeeren
Birthe Vandermeeren
17,146 Points

My solution to Guil's challenge of hiding the non-working buttons

I've created a function hideNonWorkingButtons that first loops through all buttons in the list to set their visibility to "visible".

Then, it sets the visibility of the up button of the first item in the list and the visibility of the down button of the last item in the list to "hidden".

I'm calling this function after all the buttons are created so the right buttons are hidden on the start screen. Then I'm calling it again at the end of the listUl.addEventListener, so it hides the correct buttons when one of the up, down, or remove buttons are clicked. And again at the end of the addItemButton.addEventListener, so it hides the correct buttons when an item is added to the list.

Hope this makes sense. If you have any questions, I'd be happy to clarify.

Here's my the link to my workspace: workspace with function to hide the non-working buttons

Birthe Vandermeeren
Birthe Vandermeeren
17,146 Points

You're right, Mindaugas, about the allListItems and lis, and right, firstElementChild, smart. Thanks for commenting!

1 Answer

Nice! Just you don't need to define let allListItems on line 39 as you already have const lis on line 12. And it itches for me to somehow use the defined const firstListItem and const lastListItem in the solution, but I didn't manage yet as well...

I like your solution, but I have simplified your function a bit and added comments: My Workspace

Update: I found the way to use firstElementChild and lastElementChild to traverse instead of counting items in the array :) Updated Workspace