function render(Leads){ let listItems = "" for(i = 0; i < Leads.length; i++){ listItems += ` <li> <a href='${Leads[i]}' target='_blank'> ${Leads[i]} </a> <button id="delete">❌</button> </li>` } ulEl.innerHTML = listItems}Estoy tratando de hacer una aplicación de seguimiento de clientes potenciales y he escrito este código. Quiero que el botón Eliminar funcione, pero no tengo idea de cómo puedo eliminar un elemento específico de una lista desordenada.
item${i}el primer problema es que hay varios elementos de botón con la misma identificación, la identificación debe ser única.
Aquí puede agregar un eventListenar al elemento ulEl y al hacer clic en el botón debemos eliminar el elemento
function render(Leads){ let listItems = "" for(i = 0; i < Leads.length; i++){ listItems += ` <li> <a href='${Leads[i]}' target='_blank'> ${Leads[i]} </a> <button id="delete${i}">❌</button> </li>` } ulEl.innerHTML = listItems; } ulEl.addEventListener("click", function (event) { if(event.target.id?.includes("delete")) { let id = +event.target.id.replace("delete", "") // to get the last character leads.splice(id, 1); // remove the element(please use the corresponding // variable, here I am using leads) list.innerHTML = ""; // clearing current list list.innerHTML = leads.reduce((acc, curr, idx) => { acc += ` <li> <a href='${curr}' target='_blank'> ${curr} </a> <button id="delete${idx}">❌</button> </li>`; return acc; }, ""); } });Espero que esto ayude gracias