JavaScript JavaScript and the DOM Responding to User Interaction Adding an Event Listener

Hugo Zaanen
Hugo Zaanen
9,659 Points

The background turns red but it doesnt evaluate correct

This assignment doesnt correctly eveluate. The background has been turned to red.

app.js
var warning = document.getElementById("warning");
var button = document.getElementById("makeItRed");


button.addEventListener('click', () => {
  let warning = document.getElementById("warning");
  warning.style.background = "red"; 
});
index.html
<!DOCTYPE html>
<html>
    <head>
        <title>Adding an Event Listener</title>
    </head>
    <link rel="stylesheet" href="style.css" />
    <body>
        <div id="warning">
            Warning: My background should be red!
        </div>
        <button id="makeItRed">Make It Red!</button>
        <script src="app.js"></script>
    </body>
</html>

2 Answers

Brandon White
seal-mask
MOD
.a{fill-rule:evenodd;}techdegree seal-36
Brandon White
Treehouse Moderator

Hi Hugo,

I just copy/pasted your code into the challenge, and it passed all three phases. So maybe try again, see if it works now...

That said, I'll point out one thing you're doing that maybe you don't want to do in code for your own projects.

A warning variable has already been created on the first line, so you don't really need to create a second one to be locally scoped to the callback function. You could remove this line let warning = document.getElementById("warning"); and the functionality of your code would work the exact same way.

SN: I thought that maybe the issue was that you were using the background property instead of the backgroundColor property, but like I said, your code pass all three phases of the challenge for me as is. If for some reason it still doesn't pass for you, try changing the background property to backgroundColor. (That's just me telling you to throw darts at the wall. Lol)

Hugo Zaanen
Hugo Zaanen
9,659 Points

yeah i fixed i, with the right implementation of selecting the element

Thomas Davidson
Thomas Davidson
5,439 Points

Hi Hugo,

I copied your code and it passed all three tests for me?

Maybe try restarting the challenge and pasting in your code above to see if you can get through.