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

Callum Anderson
Callum Anderson
8,837 Points
Posted by Callum Anderson
Callum Anderson
8,837 Points

Javascript and the DOM final challenge

I'm certain this code is correct, as it checks out in IE and Chrome. Why won't the final code challenge accept it?

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

for (i=0; i<paragraphs.length; i++) {
 paragraphs[i].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>

2 Answers

Callum Anderson
Callum Anderson
8,837 Points
Callum Anderson
Callum Anderson
8,837 Points

I got it now... you need to declare the iterator in the For Loop as let, because it's using strict mode.

So, first of all, if this has never been required in any of the videos/workshops to date - why introduce it now?

Secondly, why did it break Task 1 of the challenge, which was simply referencing the child paragraphs of a section?

Michael Hulet
Michael Hulet
47,912 Points
Michael Hulet
Michael Hulet
47,912 Points

It broke the challenge because it isn't valid JavaScript. It's not covered in this course specifically, because this is a feature of JavaScript and not the DOM, so the knowledge of it is a prerequisite. I'm going to assume you're either taking the JavaScript Basics track or the Full Stack JavaScript track, as those appear to be the only tracks this course is a part of. In both of these tracks, the JavaScript Loops, Arrays, and Objects course covers this explicitly, initially in its video on For Loops. In both of these tracks, that course is 4 courses before this one, so I suggest that you go back and review a bit to make sure you have all of JavaScript's syntax down

Callum Anderson
Callum Anderson
8,837 Points
Callum Anderson
Callum Anderson
8,837 Points

Thanks Michael, yes I do remember it. However, in practice it seems that omitting the let variable declaration is very common, and accepted by the major browsers. And as I said, Guil has been omitting it throughout this course too!

I still don't know how that broke Task 1 either, which was simply to assign section.paragraphs to the paragraphs variable. the For Loop wouldn't have reversed that. Strange.