Interactive Rating (mobile first)

Hi Pierre,

I sent a pull request to your project on GitHub with the changes made, I see that other people have already answered your question and helped you debug, but I wanted to let you know to look on GitHub if you wanted to practice pull requests and merging.

Hope this was helpful!

You are adding and removing the class 'hidden' inside the click event, but there is no hidden class in your css file.

submitBtn.addEventListener('click', () => {
    if (rate) {
        ratePoint.innerText = rate;
        ratingSection.classList.add('hidden');
        thankSection.classList.remove('hidden');
    }
});

You are using the hidden attribute on your html element.

<div class="thank-section" hidden>

Here is what you could do:

1. Create a hidden class in your css file.

.hidden{
   display: none;
}

1. Remove the hidden atribute from

<div class="thank-section" hidden>

and add the hidden class

 <div class="thank-section hidden" >

This should fix your problem.

Looks good overall. Congrats on completing the challenge successfully.

Regarding your issue: Here it looks like you are trying to remove the classList: thankSection.classList.remove('hidden');

but there is no class called hidden, so looks like you wrote it outside of class names here:

<div class="thank-section" hidden> Also u can add some console.log() to rate and to ur event listener of button to debug the issue if it still persists.

One more tip: You might consider removing the border from the button for a better look and match the design more :)

Hope you find this feedback helpful!