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

JavaScript

Lewis Mercer
Lewis Mercer
2,151 Points

My solution deletes more buttons than meant to and gives error.

Here is my JS:

http://bit.ly/2YhMA6r

and HTML: http://bit.ly/2LnfIUB

And the error:

app.js:36 Uncaught TypeError: Cannot read property 'style' of undefined at showAllBtn (app.js:36) at hideButtons (app.js:47) at attachListItemButtons (app.js:30) at app.js:54

and a screenshot: https://pasteboard.co/IJIbJ0Z.png

Massive thanks to anyone who can spot my mistake!

1 Answer

I made some modifications and saved them to a workspace

1) Your inner loop in hideButtons() should run for the number of children in the list item.

This:

for(let j = 0; j<lis[i].length; j +=1){

should be this:

for(let j = 0; j<lis[i].children.length; j +=1){

2) You are calling hideButtons() every time you add buttons to a list item. This results in an error here:

lastItem.children[1].style.visibility = 'hidden';

since the last list item doesn't have children until it has buttons added (after all the other list items have theirs). So I removed hideButtons() from attachListItemButtons() and call it after all buttons have been added.

for (let i = 0; i < lis.length; i += 1) {
  attachListItemButtons(lis[i]);
}

hideButtons()

3) I changed these lines in hideButtons() to reference the current child elements of the list

listUl.firstElementChild.firstElementChild.style.visibility = 'hidden';
listUl.lastElementChild.children[1].style.visibility = 'hidden';
Lewis Mercer
Lewis Mercer
2,151 Points

Wow, got work for a few days so not going to be able to give this a go quite yet but everything you have said makes perfect sense and I believe this will be really helpful. Thanks so much :)