A solution using SASS, BEM and vanilla JS

Community feedback

• 

  Fazza Razaq Amiarso•2,340

  @fazzaamiarsoPosted over 2 years ago

  Hello @dalnoki! Nice work overall!

  I did a quick refactor on your code.

  const button = document.querySelector('.card__button');
  const rating = document.getElementsByClassName('card__ratings');
  const front = document.querySelector('.card__front');
  const backText = document.querySelector('.card__text--selected');
  
  let selectedNumber = 0;
  
      for (let i = 0; i < rating.length; i++) {
          rating[i].addEventListener("click", () => {
              selectedNumber = rating[i].value;
          })
      }
      button.addEventListener("click", () => {
          backText.innerHTML = `You selected ${selectedNumber} out of 5`
          front.style.opacity = "0";
      });
  

  • you don't need to wrap the all of them IIFE. All of the listeners will still be attached.
  • you can use querySelector to get a single element.

  I hope it helps! Cheers!

  0