Add Class To Div By Id Javascript

MUAZHAN

2 min read

·

Jun 22, 2024

33

Share

Menambahkan Class ke Div dengan ID Menggunakan JavaScript

Artikel ini akan membahas cara menambahkan class ke div dengan ID menggunakan JavaScript.

Cara Menambahkan Class ke Div dengan ID

Anda dapat menambahkan class ke div dengan ID menggunakan metode classList.add() pada objek DOM. Berikut adalah langkah-langkahnya:

1. Dapatkan elemen div dengan ID: Gunakan document.getElementById() untuk mendapatkan referensi ke elemen div dengan ID yang spesifik.

2. Gunakan classList.add(): Gunakan metode classList.add() pada objek elemen div untuk menambahkan class baru.

Berikut adalah contoh kode JavaScript untuk menambahkan class "new-class" ke div dengan ID "my-div":

const myDiv = document.getElementById("my-div");
myDiv.classList.add("new-class");

Contoh Penggunaan

Berikut adalah contoh kode HTML dan JavaScript yang menunjukkan cara menambahkan class ke div dengan ID:

  Ini adalah konten div.


Tambahkan Class

Kode ini akan menampilkan div dengan ID "my-div". Saat tombol "Tambahkan Class" diklik, fungsi addClass() akan dipanggil. Fungsi ini akan menambahkan class "new-class" ke div, yang akan mengubah warna latar belakang dan warna teks div menjadi kuning dan biru.

Kesimpulan

Menambahkan class ke div dengan ID menggunakan JavaScript sangat mudah menggunakan metode classList.add(). Ini memungkinkan Anda untuk secara dinamis mengubah gaya dan perilaku elemen HTML berdasarkan kondisi tertentu.