Ich versuche, jedem Element in der Liste eine Schaltfläche zum Löschen hinzuzufügen. Das Hinzufügen funktioniert, solange ich keine Schaltfläche zum Löschen habe.

const newcontainer = document.getElementById("toDoContainers");

 //gets number of list items in todolist

 //adds list item to list

 function deleteitem(paramitem){

  var element = document.getElementById(paramitem);
  element.remove(paramitem);
 }

 function addnew(){
      let numb = document.getElementById("todolistitems").childElementCount;
      var listitem = document.createElement("li");
      var reallist = document.getElementById("todolistitems");
      var inputvar = document.getElementById("inputfield").value;
      var node = document.createTextNode(inputvar);
      let numbvar = numb +1;




      listitem.appendChild(node);
      listitem.setAttribute('id', numbvar);
      listitem.addEventListener('onClick', deleteitem(listitem));
      reallist.appendChild(listitem);  
      var inputvar = document.getElementById("inputfield").value="";
  //  node.appendChild(document.createTextNode(inputvar));
  /// document.getElementById("toDoContainers").innerHTML=inputvar;




 }

<h1>To Do List</h1>
<div class="container">
    <input id="inputfield" type="text"><button id="addToDo" onclick="addnew()">Add</button>
    <div class="tO" id="toDoContainers">
        <ul id="todolistitems">
        </ul>
    </div>
</div>

Ich habe eine Methode ausprobiert, bei der Sie für jedes Listenelement, das Sie erstellen, „onclick“ = deleteitem(item) eingeben. Ich habe versucht, queryselector, getelementbyId und queryselectorall in der Löschfunktion zu verwenden.

Das Hinzufügen von Listenelementen funktioniert, solange ich nicht versuche, die Löschfunktion hinzuzufügen.