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) Responding to User Interaction Adding an Event Listener

Kayla Reed
Kayla Reed
17,543 Points

Adding an event listener code code challenge

I've been trying to figure out what I'm doing wrong in this code challenge. It is asking me to add a click event listener on the button and pass an empty function in as the second parameter. Can someone help me understand what I'm doing wrong here?

app.js
const warning = document.getElementById("warning");
let button = document.getElementById("makeItRed");
button.addEventListener('click', (){});
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>
Josh Rubner
Josh Rubner
Courses Plus Student 6,766 Points

hi kayla

try

button.addEventListener('click', function(){});

1 Answer

andren
andren
28,558 Points

A pair of pair of parenthesis and a pair of brackets is not enough to declare a function. If you were trying to declare a fat arrow function then you are missing the fat arrow. An empty fat arrow function looks like this:

() => {}

If you were trying to create an empty traditional function then you are missing the function keyword. An empty function looks like this:

function() {}
Kayla Reed
Kayla Reed
17,543 Points

Yes, I was trying to add an empty function. It seems so obvious now, thank you!