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 JavaScript and the DOM Getting a Handle on the DOM Select by Tag Name

Posted by Charlotte Jane Pollard
Charlotte Jane Pollard
Courses Plus Student 3,200 Points

I don't understand the error.. is there a bug because I'm sure I've answered it right??? :/

I've answered the question in accordance with what I've just learned (to look up and select multiple elements in a collection (the <ul> elements in this case) so...

let listItems = document.getElementsByTagName('ul');

but it's returning the error:

Bummer: cannot read property 1 of null

I don't understand... it's a simple answer to a simple question, am I missing something??? :/

app.js 
// Complete the challenge by writing JavaScript below
const colors = ["#C2272D", "#F8931F", "#FFFF01", "#009245", "#0193D9", "#0C04ED", "#612F90"];
let listItems = document.getElementsByTagName('ul');

for ( let i = 0; i < colors.length; i++ ) {
  listItems[i].style.color = colors[i];    
}
index.html 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>JavaScript and the DOM</title>
  </head>
  <body>
    <h1>My List</h1>
    <ul>
      <li>This should be red</li>
      <li>This should be orange</li>
      <li>This should be yellow</li>
      <li>This should be green</li>
      <li>This should be blue</li>
      <li>This should be indigo</li>
      <li>This should be violet</li>
    </ul>
    <script src="app.js"></script>
  </body>
</html>

1 Answer

Ngadhnjim Rexhaj
Ngadhnjim Rexhaj
45 Points

instead of '' document.getElementsByTagName('ul'); " use " document.getElementsByTagName('li'); " because you're not iterating in items(li) but in list itself, also try duplicating code and you'll see that for every <ul> you'll have different colors from array.

Charlotte Jane Pollard
Charlotte Jane Pollard
Courses Plus Student 3,200 Points

Thank you. That's what I did in the end, but the question specifically said to reference the ul elements, maybe I read it wrong or didn't read into it enough.. Thank you for taking the time to answer my question! :)

"Complete the code by setting the variable listItems to refer to an HTMLCollection. The collection should contain all list items in the <ul> element."