Кнопка HTML, вызывающая прослушиватель событий, не работает HTML и JS

Question

Я составил список элементов с JSON и JS, и мне нужно иметь возможность удалить их.

function deleteList(){
  document.querySelector('#delete').addEventListener('click', (e) => {
    document.querySelector('#exerciseList').innerHTML = '';
  });
}

Вот моя кнопка HTML:

<button onclick="deleteList()" id="delete">Clear List</button>
<section id="exerciseList"></section>

это просто не связаны, верно?

Answer 1

Вы добавляете прослушиватель событий или атрибут onclick, поэтому

function deleteList() {
  document.querySelector("#exerciseList").innerHTML = "";
}

<button onclick="deleteList()" id="delete">Clear List</button>
<section id="exerciseList">list</section>

или, рекомендуется:

document.querySelector("#delete").addEventListener("click", e => {
  document.querySelector("#exerciseList").innerHTML = "";
});

<button id="delete">Clear List</button>
<section id="exerciseList">list</section>