None of buttons is working, please what am i doing wrong?

Question

My Javascript File

const toggleList = document.getElementById('toggleList');
const listDiv = document.querySelector('.list');
const descriptionInput = document.querySelector('input.description');
const descriptionP = document.querySelector('p.description');
const descriptionButton = document.querySelector('button.description');
const addItemInput = document.querySelector('input.addItemInput');
const addItemButton = document.querySelector('button.addItemButton');

toggleList.addEventListener('click', ()=> {
  if (listDiv.style.display == 'none') {
    toggleList.textContent = 'Hide list';
    listDiv.style.display = 'block';
  } else {
    toggleList.textContent = 'Show list';
    listDiv.style.display = 'none';
  }
});

descriptionButton.addEventListener('click', ()=> {
  descriptionP.innerHTML = descriptionInput.value + ':';
});

addItemButton.addEventListener('click', ()=> {
  let ul = document.getElementsByTagName('ul')[0],
  let li = document.createElement('li');
  li.textContent = addItemInput.value;
  ul.appendChild(li);
  addItemInput.value = '';
})

My HTML File

<!DOCTYPE html>
<html>
  <head>
    <title>JavaScript and the DOM</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <h1 id="myHeading">JavaScript and the DOM</h1>
    <p>Making a web page interactive</p>
    <button id='toggleList'>Hide List</button>
    <div class="list">
      <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>

<input type='text' class='addItemInput'>
<button class='addItemButton'>Add Item</button>
  </div>
  </body>
  <script src="script.js"></script>
</html>

Answer 1 · 2018-08-27T02:28:36Z

August 27, 2018 2:28am

Your code is good except for one very minor error on this line:

let ul = document.getElementsByTagName('ul')[0],

You have a comma at the end instead of a semi-colon. Fixing that error should resolve your issue.

Welcome to the Treehouse Community

Looking to learn something new?

Paul Israel

Paul Israel

None of buttons is working, please what am i doing wrong?

1 Answer

Richard Pichardo

Richard Pichardo