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) Getting a Handle on the DOM A Simple Example

Antwaun Johnson
PLUS
Antwaun Johnson
Courses Plus Student 11,157 Points
Posted by Antwaun Johnson
Antwaun Johnson
Courses Plus Student 11,157 Points

Having trouble getting code to work

Greetings,

I am using an HP chromebook for the time being and I am having trouble the the code in this section. Since I started a few weeks ago, I have been able see mistakes and make corrections. I'm hopeful that another eye can see something I can not.

const myHeading = document.getElementById('myHeading')

myHeading.addEventListener('click', () => { myHeading.style.color = 'red'
});

3 Answers

james south
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
james south
Front End Web Development Techdegree Graduate 33,271 Points
james south
.a{fill-rule:evenodd;}techdegree seal-36
james south
Front End Web Development Techdegree Graduate 33,271 Points

with an arrow function, if there is only the return statement in the function body, the return is implied and neither the return keyword nor the curly braces are necessary, so try removing the curlies from the function body.

myHeading.addEventListener('click', () => myHeading.style.color = 'red');
Antwaun Johnson
Antwaun Johnson
Courses Plus Student 11,157 Points
Antwaun Johnson
Antwaun Johnson
Courses Plus Student 11,157 Points

James,

Thanks for your help. I finally discovered that I had it linked wrong in the html file.

Charlie Harcourt
Charlie Harcourt
8,046 Points

So why in the example does the teacher use curly braces if they are not needed?

Thanks for the help :)

Alex MacDonald
Alex MacDonald
11,668 Points
Alex MacDonald
Alex MacDonald
11,668 Points

I could be wrong (I'm still learning too!), but I think you need a semi-colon after 'red'.

babasariffodeen
babasariffodeen
6,475 Points

Yes I think that is the problem. Without the semi-colon, that line of code doesn't get seen as its own line of code. So it breaks there.

This is where the semi-colon is missed:

const myHeading = document.getElementById('myHeading')

and it should be:

const myHeading = document.getElementById('myHeading');

Charlie Harcourt
Charlie Harcourt
8,046 Points

He had the semi colon it was on the line below. It doesn't matter what line it is on as long as the function is correct and the relevant values are inside of it.

:)

Antwaun Johnson
PLUS
Antwaun Johnson
Courses Plus Student 11,157 Points
Antwaun Johnson
Antwaun Johnson
Courses Plus Student 11,157 Points

Thanks James, your input is greatly appreciated. I have tried removing the curly braces to no avail.

Charlie Harcourt
Charlie Harcourt
8,046 Points

If you are still struggling can you post your code. :)