Penghapusan Diri Elemen Baru pada JavaScript

Dalam pelajaran sebelumnya, kita telah belajar cara membuat elemen menghapus diri mereka sendiri saat diklik.

Sekarang misalkan tidak ada elemen di dalam induknya secara awal:

<div id="parent"></div>

Mari kita buat 9 paragraf baru dalam sebuah loop, dan sekaligus membuat agar paragraf mana pun dapat dihapus dengan mengkliknya:

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);
}

Diberikan kode berikut:

<ul id="parent">
	<li>1</li>
	<li>2</li>
	<li>3</li>
</ul>

<input type="submit" id="button">

Buatlah agar ketika tombol diklik, sebuah elemen baru ditambahkan ke dalam daftar. Buatlah agar setiap li dapat dihapus dengan mengklik padanya. Hal ini berlaku untuk li yang sudah ada dalam daftar, maupun yang baru, yang dibuat setelah tombol ditekan.