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 (Retiring) Traversing the DOM Child Traversal

Posted by Yeshaya Coffman
.a{fill-rule:evenodd;}techdegree seal-36
Yeshaya Coffman
Full Stack JavaScript Techdegree Graduate 22,885 Points

paragraphs still has the HTML collection, why is task 1 no longer passing?

The paragraphs variable still has the section.children why is task one no longer passing

app.js 
const section = document.querySelector('section');
let paragraphs = section.children;

for (i=0; i<3; i+= 1) {
 let paragraph = paragraphs[i];
  paragraph.style.color = 'blue';
}
index.html 
<!DOCTYPE html>
<html>
    <head>
        <title>Child Traversal</title>
    </head>
    <body>
        <section>
            <p>This is the first paragraph</p>
            <p>This is a slightly longer, second paragraph</p>
            <p>Shorter, last paragraph</p>
        </section>
        <footer>
            <p>&copy; 2016</p> 
        </footer>
        <script src="app.js"></script>
    </body>
</html>

1 Answer

tomd
tomd
16,701 Points
tomd
tomd
16,701 Points

I had this exact problem a few weeks ago, in your 'for' loop, you need to assign 'i' to a variable. Like this 

for (let i = 0; i < 3; i += 1)
Yeshaya Coffman
.a{fill-rule:evenodd;}techdegree seal-36
Yeshaya Coffman
Full Stack JavaScript Techdegree Graduate 22,885 Points

Thanks for the answer this fixed it, It's weird that the code still works in a browser, just here for some reason it doesn't !?

Jennifer Nordell
seal-mask
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher
Jennifer Nordell
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher

Yeshaya Coffman Some of these challenges are run in strict mode, and that is why it is not passing without the let or var as strict mode does not allow the implicit declaration of global variables. When you have something that's running in the browser, but not in the code challenge, try using strict mode and see if it still works. If it doesn't, your problem might be there.