Event Delegation

[Dujota]

https://github.com/rudilone/Hangman/blob/a8db57c7307f266c70cfe40082ff58e0490e7fac/script.js#L48

so this event listener is almost there

you would modify it just a bit:

const myButtonsContainer = document.getElementById("buttons");

// then you can use the same event listener, but attach it to the myButtonsContainer

// you need the event object passed to the callback function (the function inside the event handler) 

myButtonsContainer.addEventListener("click", function (event) {

// first check to see if the button clicked has the letter with the right answer
   const button = event.target 
   const letter = event.target.innerText
   if(letter === 'e'){
   // you update both the blank elements for the letter e

   }else if( letter == 'l'  ){
   // next check if the letter is l, p, h, a, n, t
   button.remove()
   }else if(letter == 'p' ){

    // update the blank element for the p 
    // then you update right answer by 1
    // then remove the button
   button.remove()
   }else if(... keep checking for more letters)
   // do one else if(){} for each correct letter guess that does the same thing as the previous ones 
// add 1 to correct answer and remove the button
correctAnswr +=1
   button.remove()
  }else{. // after you check for any right letter, then the only ones left are wrong letters so you can just group them trogether
   // here would be any letter that is not in elephant. so we can safely say just add 1 to wrong guess
   wrongGuess +=1
}

  console.log (numCorrect, numWrong)
});

[Dujota]

i recommend do one letter at a time.

so start with a simple if statement

if(letter === 'e'){
 // update the 2 blanks and add 1 to correctAnswr then remove the button
}else{
add 1 to wrong aswer and remove the button
}

once that starts to take shape you can add the next letter 'l' into an else if(){} and work your way up