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:

html<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:

javascriptlet 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);
}
Задание 1

Se da el siguiente código:

html<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.