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

Giacomo Zanin
seal-mask
.a{fill-rule:evenodd;}techdegree
Giacomo Zanin
Full Stack JavaScript v2 Techdegree Student 4,765 Points
Posted by Giacomo Zanin
.a{fill-rule:evenodd;}techdegree
Giacomo Zanin
Full Stack JavaScript v2 Techdegree Student 4,765 Points

Bummer: Make sure that you're applying the correct color to each list item

Dear All, I am using this code const colors = ["#C2272D", "#F8931F", "#FFFF01", "#009245", "#0193D9", "#745CBF", "#C724B1"]; let listItems = document.querySelector('ul').getElementsByTagName('li');

for (let i = 0; i < colors.length; i++) { listItems[i].style.color = colors[i]; } I do not know why it should not work, I checked the colour names and they should be correct. Thanks in advance, Giacomo

app.js 
const colors = ["#C2272D", "#F8931F", "#FFFF01", "#009245", "#0193D9", "#745CBF", "#C724B1"];
let listItems = document.querySelector('ul').getElementsByTagName('li');

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>

2 Answers

Travis Alstrand
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Travis Alstrand
Treehouse Project Reviewer
Travis Alstrand
.a{fill-rule:evenodd;}techdegree seal-36
Travis Alstrand
Treehouse Project Reviewer

Hey there Giacomo Zanin ! 👋

The code that you wrote is perfect! The issue is, it seems the colors in your colors array have been changed. So the backend of the challenge was looking for specific colors in specific places and it wasn't getting it. You'll just need to paste in what was there when originally opening the challenge.

const colors = ["#C2272D", "#F8931F", "#FFFF01", "#009245", "#0193D9", "#0C04ED", "#612F90"];