JS HTML DOM

<!DOCTYPE html>
<html>
<body style="font-family: sans-serif; padding: 20px;">
    <h2 class="target-judul">Memanipulasi Elemen via DOM</h2>
    <p class="deskripsi">Teks ini akan diubah oleh JavaScript menggunakan querySelector.</p>
    <button onclick="manipulasiDOM()" style="padding:10px 15px; cursor:pointer;">Ubah Sekarang</button>

    <script>
        function manipulasiDOM() {
            const judul = document.querySelector('.target-judul');
            const p = document.querySelector('.deskripsi');

            judul.innerText = "DOM Berhasil Diubah!";
            judul.style.color = "#04AA6D";
            p.innerText = "Kelas CSS dan style warna telah dimodifikasi secara dinamis!";
        }
    </script>
</body>
</html>