Autoborrado de nuevos elementos en JavaScript
En la lección anterior, aprendimos a hacer que los elementos se eliminen a sí mismos al hacer clic.
Ahora supongamos que inicialmente no hay elementos en el padre:
<div id="parent"></div>
Vamos a crear 9 nuevos párrafos en un bucle,
y hagamos que cualquier párrafo se elimine
al hacer clic en él:
let parent = document.querySelector('#parent');
for (let i = 1; i <= 9; i++) {
let p = document.createElement('p');
p.textContent = i;
p.addEventListener('click', function() {
this.remove();
});
parent.appendChild(p);
}
Se da el siguiente código:
<ul id="parent">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<input type="submit" id="button">
Haz que al hacer clic en el botón se
agregue un nuevo elemento a la lista. Haz
que cualquier li se elimine al hacer clic en
ella. Esto se aplica tanto a los li que ya
están en la lista, como a los nuevos, creados después
de hacer clic en el botón.
