Interactive rating component with JS

Hi Albana, well done on your second challenge, and I think what you did using buttons is a good start! 😊 That was also what I did when I first completed the challenge, and it was only later when I updated it that I rewrote it using radio buttons.

About the JavaScript and HTML in general, I think you did a lot of things well here. Your method of nesting the submit button event listener within the button event listener is an interesting solution in preventing the user from proceeding without a rating, and it's probably the first one I've seen that does that. Anyway, the two suggestions I would offer are as follows:

1. Generally it is good practice to use const over let for variables that don't change (such as elements from the DOM). This is just to prevent an accident reassignment from happening, and I'd say in 90% of the situations you'd want to use const for variables. The only variable I would use let for here is the numberSelected one because that's bound to change.

2. Instead of using the innerHTML for retrieving the value, I'd suggest writing the value as an attribute within the button (e.g., <button class="rate-number" value="5">5</button>). I just think it's a safer way to retrieve information from the element's attributes than from its innerHTML, which could change in certain scenarios, like if the innerHTML got written over somehow.

If you're interested in checking out other ways to do this challenge, I have a small CodePen collection with various solutions, including the radio button one: https://codepen.io/collection/oErbpe

Great work here, and looking forward to more 😊