Estoy creando una simple "lista de tareas" con Java Script. Tengo una plantilla para tareas, cuyo contenido me gustaría clonar, y luego intento insertar el texto de la tarea dentro de este contenido.

 <template id="li-temp"> <li class="todo-item__undone"></li> <button class="delete-item-button delete-item-button-not-displayed">&#10008;</button> </template>

Un método que intenta clonar el contenido de la plantilla e insertar el contenido de la tarea:

 createTaskHtml(content, status, id){ let template = document.getElementById("li-temp").content.cloneNode(true); let li = template.firstChild; let li_test = document.createElement("li") li.id = id; li.innerText = content; let deleteButton = template.lastChild; if (status === "done"){ li.classList.add("todo-item__done"); deleteButton.classList.remove("delete-item-button-not-displayed"); this.setListener(deleteButton); } return li; }

Usé "contenido" para obtener el contenido de la plantilla, luego usé el método "cloneNode (verdadero)" para la clonación profunda. Espero obtener un nodo con dos elementos secundarios (li y botón), por lo que estoy tratando de obtener el objeto li como primer elemento secundario. Pero luego recibo un error porque el objeto li no tiene el atributo "id" e "innerText".

Depuré este código y me sorprendió descubrir que WebStorm identificó este nodo como nodo de texto. Así que supongo que de alguna manera estoy copiando incorrectamente el contenido de la plantilla, pero, por supuesto, admito que el error puede estar en otra cosa.