JavaScript DOM Scripting By Example Editing and Filtering Names States of the Application

The remove button, stopped working all of a sudden. Can´t seem to understand why?

It worked previously, but not now.

const form = document.getElementById("registrar");
const input = form.querySelector("input");
const ul = document.getElementById("invitedList");


function createLI(text){
  const li = document.createElement("li");
  li.textContent = text;

  const label = document.createElement("label");
  label.textContent = "ok";

  const checkbox = document.createElement("input");
  checkbox.type = "checkbox";

  label.appendChild(checkbox);
  li.appendChild(label);

  //EDIT

  const editButton = document.createElement("button");
  editButton.textContent = "edit";
  li.appendChild(editButton);

  // REMOVE
  const Removebutton = document.createElement("button");
  Removebutton.textContent = "remove";
  li.appendChild(Removebutton);
  return li;
}


form.addEventListener("submit", (e) => {
e.preventDefault();

const text = input.value;
input.value = "";


 const li = createLI(text);
   ul.appendChild(li);
});

ul.addEventListener('change', (e) => {

  const checkbox = event.target;
  const checked = checkbox.checked;
  const listItem = checkbox.parentNode.parentNode;


  if(checked) {
  listItem.className = "responded";
  }
  else {
  listItem.className = "";
  }

  });

ul.addEventListener("click", (e) => {

  if (e.target.tagName === "BUTTON") {
  if (e.target.text === "remove") {
    const li = e.target.parentNode;
    const ul = li.parentNode;
    ul.removeChild(li);
}
     else if (e.target.textContent === "edit") {
     console.log("editing");
     }

}});

1 Answer

KRIS NIKOLAISEN
PRO
KRIS NIKOLAISEN
Pro Student 51,941 Points

Here you are checking text instead of textContent

if (e.target.text === "remove") {

Make that change and functionality should be restored