DOM vanilla JS basic

import './style.css'

// Akses dom
// const myButton = document.querySelector('a') // ambil element berdasarkan id, class, tag sama seperti css selector
const myButton = document.getElementById('tombol') // ambil element berdasarkan id, class, tag sama seperti css selector
const buttonAmanda = document.querySelector('.saya-amanda') // ambil element berdasarkan id, class, tag sama seperti css selector

const inputNama = document.querySelector('#input-nama')

const printNama = document.createElement('h1')
printNama.id = 'print-nama'
printNama.classList.add('heading')

const printContainer = document.getElementById('print-container')
printContainer.appendChild(printNama)

// Manipulasi dom
function handleClick() {
  alert('bim salabim')

  console.log(buttonAmanda)
  buttonAmanda.innerHTML = 'Saya amanda'
}
myButton.addEventListener('click', handleClick)

inputNama.addEventListener('keyup', function(event) {
  const value = event.target.value

  printNama.innerHTML = 'Nama saya ' + value
})


const hapusElemen = document.querySelector('#hapus-elemen')

hapusElemen.addEventListener('click', function() {
  printNama.remove()
})