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!

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 One Solution

8,632 Points

Traversing the DOM - my solution

I'm finding it hard remembering which methods to use when trying to solve a problem. After reviewing how Guil coded his solution, I realize mine is not has simplified. I was still able to get solve every section but not in the cleanest code.

// STARTING POINT const list = document.querySelector('.list'); const listItems = list.children;

// 1: Store the first child of the ul in the variable firstItem const firstItem = document.getElementsByTagName('li')[0];; firstItem.style.backgroundColor = '#04c5e6';

// 2: Using traversal, store the second list item in a variable named nextItem const nextItem = document.getElementsByTagName('li')[1];; nextItem.style.backgroundColor = '#b7c7d0';

// 3: Store the last child of the ul in a variable named lastItem const lastItem = document.getElementsByTagName('li')[2];; lastItem.style.backgroundColor = '#57d6ab';

// 4: Using traversal, store the second-to-last list item in a variable named prevItem const prevItem = document.getElementsByTagName('li')[3]; prevItem.style.backgroundColor = '#f36f49';

// 5: Store the nested div in a variable named banner const banner = document.getElementsByTagName('div')[1]; banner.className = 'banner';

// 6: Using traversal, store the wrapper div in a variable named wrapper const wrapper = document.getElementsByTagName('div')[0]; wrapper.style.backgroundColor = '#fcfcfc';

// 7: Using traversal, store the body in a variable named body const body = document.querySelector('body'); body.style.backgroundColor = '#f8fdf3';

1 Answer

Steven Parker
Steven Parker
224,849 Points

Being able to solve every task is by far the most important part of the job. Being able to also make it efficient and compact will come with practice.