Javascript-08.todo list 삭제하기

작성해놓은 todo list를 삭제하기 위해서는
먼저 span 옆에 x 라는 버튼을 추가한다.

어차피 js 안에서 파일을 수정하고 html은 손대지 않는다.
다음의 코드를 추가한다.

const button = document.createElement("button");
  li.appendChild(span);
  li.appendChild(button);
  span.innerText = newTodo;
  button.innerText = "X";

그리고 당연히 button이 클릭되었을 때 이벤트를 리슨해주어야 한다.

button.addEventListener("click", deleteTodos);

그런다음 deleteTodos 함수를 정의한다.
이 함수는 사용자가 클릭한 리스트를 찾아서 그것을 delete 해주어야 한다.
어떤 것이 클릭된 것인지 정확히 찾고 그것을 삭제해야 한다.
그래서 그 타겟이 어떤 것인지 정확히 찾는 변수를 할당해주어야 한다.
타겟 대상의 부모 객체(li)를 삭제해주기 위해 다음과 같이 작성한다.

function deleteTodos(event) {
  const removingOne = event.target.parentElement;
  removingOne.remove();
}