Estoy creando una lista de tareas pendientes simple y usaré el método de empalme para eliminar elementos de la lista. No puedo conseguir que funcione. Llevo el elemento empalmado a la consola, por lo que la "conexión" entre mi botón de eliminación y mi función de eliminación parece funcionar. También probé el método de corte y funciona, pero por alguna razón el método de empalme no funciona. A continuación se muestra la matriz que utilizo para insertar mis nuevos elementos en mi clase, la función que crea el HTML para los nuevos elementos pendientes y la función de eliminación de elementos. ¿Alguna idea de por qué el método de empalme no funcionará?

 //ARRAY FOR NEW TODO ITEMS let newTodo: Todo[] = []; // FUNCTION THAT CREATES THE HTML FOR THE NEW TODO ITEM let doneBtn = document.createElement("button"); function htmltask() { let taskDiv = document.createElement("div"); taskDiv.innerHTML = ""; for (let i = 0; i < newTodo.length; i++) { taskDiv.className = "taskDiv"; taskDiv.innerHTML = newTodo[i].todoItem; let btnContainer = document.createElement("div"); btnContainer.className = "btnContainer"; // REMOVEBTN // let removeBtn = document.createElement("button"); removeBtn.innerHTML = "REMOVE"; removeBtn.addEventListener("click", (e) => { remove(e, i); }); // DONEBTN // let doneBtn = document.createElement("button"); doneBtn.innerHTML = "DONE"; doneBtn.className = "doneBtn"; newTaskDiv.appendChild(taskDiv); taskDiv.appendChild(btnContainer); btnContainer.appendChild(doneBtn); btnContainer.appendChild(removeBtn); } localStorage.setItem("newTodo", JSON.stringify(newTodo)); } // FUNCTION TO REMOVE ITEMS function remove(e: Event, i: number) { newTodo.splice(i, 1); htmltask(); }