Kenapa hanya tombol pertama saja yg berfungsi (JAVASCRIPT)?

kenapa hanya tombol pertama saja yg berfungsi? padahal semua button Ubah memppunyai class yg sama coba agan klik tombol tambah dulu lalu klik tombol Ubah yg baru dibuat pasti fungsi ngga jalan

<ul>
	<li class="wrap">
		TEXT
		<button class="ubah">Ubah</button>
	</li>
	<li>
		<button class="tambah">Tambah</button>
	</li>
</ul>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>
	let i = 0;
	let color = ["red","blue","green"];
	$(".ubah").click(function() {
		$(this).parent().css("background",color[i]);
		i++;
		if(i>2) {
			i=0;
		}

	});

	let el = `<li class="wrap">TEXT<button class="ubah">Ubah</button></li>`;
	$(".tambah").click(function() {
		$(".wrap").append(el);
	})
</script>
avatar iamfreestyler
@iamfreestyler

341 Kontribusi 57 Poin

Diperbarui 6 tahun yang lalu

2 Jawaban:

Jawaban Terpilih

semoga membantu

 <script>

	let i = 0;
	let color = ["red","blue","green"];
	$(document).on('click', '.ubah' ,function() {
		$(this).parent().css("background",color[i]);
		i++;
		if(i>2) {
			i=0;
		}
	})

	let el = '<li class="wrap">TEXT<button class="ubah">Ubah</button></li>';
	$(".tambah").click(function() {
		$(".wrap").after(el);
	})

</script>
avatar dianarifr
@dianarifr

642 Kontribusi 316 Poin

Dipost 6 tahun yang lalu

thanks gan

avatar iamfreestyler
@iamfreestyler

341 Kontribusi 57 Poin

Dipost 6 tahun yang lalu

Login untuk ikut Jawaban