Why does my code almost never work even though it looks the same as shown in the video?

Question

Here is my Javascript: ```const myHeading = document.getElementById('myHeading'); const myButton = document.getElementById('myButton'); const myTextInput = document.getElementByID('myTextInput');

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

});

Here is the HTML:
```<!DOCTYPE html>
<html>
  <head>
    <title>JavaScript and the DOM</title>
    <link rel="stylesheet" href="css/style.css">
  </head>
  <body>

    <h1 id="myHeading">JavaScript and the DOM</h1>
    <p>Making a web page interactive</p>
       <input type ="text" id="myTextInput"> 
    <button id="myButton">Change the color to whatever you like</button>
    <script src="app.js"></script>
  </body>
</html>```

Answer 1 · 2017-01-30T03:25:59Z

January 30, 2017 3:25am

You're getting a TypeError because :

const myTextInput = document.getElementByID('myTextInput');

.getElementById is case-sensitive and you've got a capital D in "Id",

Answer 2 · 2017-01-30T03:27:48Z

January 30, 2017 3:27am

Wild Porpoise,

It looks like you capitalized "ID" in document.getElementByID('myTextInput') Try: document.getElementById('myTextInput')

Give that a shot and see what happens. Best of luck!

Welcome to the Treehouse Community

Looking to learn something new?

Wild Porpoise

Wild Porpoise

Why does my code almost never work even though it looks the same as shown in the video?

2 Answers

Rich Zimmerman

Rich Zimmerman

Brandon Leichty

Brandon Leichty