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

Sahan Balasuriya
Sahan Balasuriya
10,115 Points
Posted by Sahan Balasuriya
Sahan Balasuriya
10,115 Points

My code doesn't change the description I don't know why , i followed everything exactly.

here is the javascript 

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

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

here is the 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,536 Points
Steven Parker
Steven Parker
177,536 Points

The "arrow" operator, used to define functions, is "=>". The symbols must be adjacent.

With an intervening space, it becomes two different operators, and assignment and a greater-than comparison.