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 Getting a Handle on the DOM Select by ID

Michael Lugo
Michael Lugo
4,921 Points

Javascript and the DOM getElementById method challenge question...

These are the instructions for challenge task number 2 (I already passed the first):

Next, declare a new variable named input. Point the variable to the input element with the ID input-phrase. Use the method that returns an element matching the specified ID.

Here is the code that's returning a "Bummer" error:

const button = document.getElementById ('btn-phrase');

const input = document.getElementById ('input-phrase');

button.addEventListener('click', () => {
  alert(input.value);
});

HTML:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Phrase Sayer</title>
  </head>
  <body>
    <p><label for="input-phrase">Type a phrase</label></p>
    <p><input type="text" id="input-phrase"></p>
    <p><button id="btn-phrase">Say Phrase</button></p>
    <script src="app.js"></script>
  </body>
</html>

Am I missing something here? As far as I understand, I am indeed calling the Id for input-phrase, but the challenge tells me I am not... Thanks in advance and my apologies if this is not posted correctly. This is the first time I write a question here XD

1 Answer

Steven Parker
Steven Parker
231,269 Points

The error message is a bit misleading. The challenge is expecting "best practice" formatting, and it doesn't like having spaces between the method names and the open parentheses even though the code would work in actual use.

You may want to report this as a bug the to Support foks.