const buttonElement = document.getElementById( "attack-button" );
buttonElement.onclick = function() {
    console.log("Attack Button Clicked");
}
// Chain the code (line 9-10) together
// so there is a single line of code for both
// and we don't declare any consts
// do the same with lines 18-19
const heroElement = document.getElementById( "hero" );
heroElement.innerHTML = 
    `<div class="character">
        <div class="name"> Wizard </div>
        <div class="emoji"> 🧙 </div>
        <div class="health">health: <b> 60 </b></div>
        <div class="dice-container"><div class="dice"> 6 </div></div>
    </div>`; 

const monsterElement = document.getElementById( "monster" );
monsterElement.innerHTML = 
    `<div class="character">
        <div class="name"> Spider </div>
        <div class="emoji"> 🕷 </div>
        <div class="health">health: <b> 10 </b></div>
        <div class="dice-container"><div class="dice"> 2 </div></div>
    </div>`;