Tengo este problema: agrego mi tarjeta y hago un elemento de la lista en el almacenamiento local y, después de actualizar la página, no puedo hacer clic en él.

El problema es que: cuando trato de agregar después de actualizar la página, no agrega un nuevo elemento en "tarea pendiente", antes de actualizar, cuando hago clic en el elemento, puedo abrir una ventana emergente modal, pero después de actualizar no puedo.

Aquí está mi código:

https://jsfiddle.net/adulik/ztjf0y1m/1/

 function addTaskListItem(id) { //get element by id const task = document.getElementById(id); //creating new task in block let localItems = JSON.parse(localStorage.getItem("localItem")); const item = localItems.find(el => el.id === id); if (item.tasks) { item.tasks.push(task.value) } else { item.tasks = [task.value] } localItems = localItems.filter(el => el.id !== id); localItems.push(item); localStorage.setItem("localItem", JSON.stringify(localItems)) if (task.value.length === 0) { alert('add new task'); return [] } const list = document.getElementById(`${id}-list`); const listItem = createElement('div', task.value, 'list-item'); listItem.addEventListener("dblclick", togglecontainer); closeButton.addEventListener("click", togglecontainer); window.addEventListener("click", windowOnClick); listItem.setAttribute('draggable', true); task.value = ''; list.append(listItem); dragNDrop(); }