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) Making Changes to the DOM Getting and Setting Text with textContent and innerHTML

Daniel McHugh
Daniel McHugh
1,821 Points
Posted by Daniel McHugh
Daniel McHugh
1,821 Points

Code not working. Pretty sure I typed it exactly as shown so I'm confused.

According to the console it's getting hung up on the addEventListener portion of the code saying "Uncaught TypeError: Cannot read property 'addEventListener' of null at app.js:5"

I can't figure out for the life of me why this would be causing problems but every piece of code to come after it is clearly not functioning. What am I doing wrong? Previously my problem was arrow syntax not working with IE, but I'm using chrome now.

Screenshot: https://w.trhou.se/xuwgy0etxe

Code:

const input = document.querySelector('input'); const p = document.querySelector('p.description'); const button = document.querySelector('button');

button.addEventListener('click', () => { p.textContent = input.value + ':'; });

2 Answers

Steven Parker
Steven Parker
229,732 Points
Steven Parker
Steven Parker
229,732 Points

Your script is trying to add a listener to the element referenced by your variable named "button". That variable gets assigned on line 3:

const button = document.querySelector('button');

But there's no <button> element in index.html, so the call to querySelector returns null. So when you try to add the listener you get that error.

That element was added to the project at about 2:30 in the video, along with some other elements that also seem to be missing in this code. Did you maybe forget to save that file before switching tabs to work on the script file?

Dante Scavonni
Dante Scavonni
433 Points
Dante Scavonni
Dante Scavonni
433 Points

Steven Parker, you are helping everybody a lot with your answers. Thank you!