JavaScript JavaScript and the DOM Making Changes to the DOM Getting and Setting Text with textContent and innerHTML

Nicholas Wallen
Nicholas Wallen
12,278 Points

Code copied exactly from video, does not work

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

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

<!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>
<p class="description">Things that are purple:</p> <input type="text" class="description"> <button class="description">Change list description</button> <ul> <li>grapes</li> <li>amethyst</li> <li>lavender</li> <li>plums</li> </ul> <script src="app.js"></script> </body> </html>

1 Answer

Steven Parker
Steven Parker
177,602 Points

This code has "Document" (with a capital "D", which is not defined) in three places instead of "document" (with a lower-case "d").