JavaScript JavaScript and the DOM Getting a Handle on the DOM Select a Page Element By Its ID

myTextInput is not defined

I have declared the const but the console is saying:

VM323:1 Uncaught ReferenceError: myTextInput is not defined
    at <anonymous>:1:1

Here is the code:

<!DOCTYPE html>
    <title>JavaScript and the DOM</title>
    <link rel="stylesheet" href="css/style.css">
    <h1 id="myHeading">JavaScript and the DOM</h1>
    <p>Making a web page interactive</p>
    <input type="text" id="myTextInput">
    <button id="myButton">Change headline color</button>
    <script src="app.js"></script>
const myHeading = document.getElementById('myHeading');
const myButton = document.getElementById('myButton');
const myTextInput = document.getElementById('myTextInput');

myButton.addEventListener('click', () => { = 'red';

Which is the problem with mytextInput that makes the console say it's not defined?


Adam Beer
Adam Beer
11,292 Points

I checked your code, and it's the good code. My console was clean. I don't have idea why told to you "it's not defined".

Ps.: Use the Markdown Cheatsheets


Wrap your code with 3 backticks (```) on the line before and after. If you specify the language after the first set of backticks, that'll help us with syntax highlighting.

      <p>This is code!</p>
Antonio De Rose
Antonio De Rose
20,866 Points

@Adam the suggestion, is a good enough suggestion to go into the answer area, so the other people will also would benefit.

2 Answers

The code itself is good. The only thing that raised a similar kind of error that I could replicate (I'm testing in Google Chrome) was when I put the app.js file in its own directory (i.e., a folder named js) and didn't update the link to it in the <script> tags in the html file to reflect this change.

So, since we can't see your file structure here, that may be something else to double check. :white_check_mark:

Steven Parker
Steven Parker
203,722 Points

It looks like "myTextInput" is only defined in this code. I don't see any reference to it where that kind of error might be generated. Perhaps there's more of the code than is shown here?

To share the complete project, you can use the "snapshot" function in the workspace and provide the link it creates.