Interactive Rating Component using html css javascript

Hi there. You did a good job 😎

keep improving your programming skills🛠️

your solution looks great, however, if you want to improve it, you can fix these points:

✅ for better performance you can initially set it hidden, and after submit show it

// Submit handler function
function submitter(itemid) {
    document.getElementById('container').innerHTML = `
     <div class="thankyou-container">
    <div class="thankyou-img-container">
        <img src="./images/illustration-thank-you.svg" alt="thankyou img">
    </div>
    <div class="selected-rating-info">
        <h1>You selected ${Number(itemid) + 1} out of 5</h1>
    </div>
    <h1 class="thank-you">Thank you!</h1>
    <div class="thankyou-message">
        <p>We appreciate you taking the time to give a rating. If you ever need more support,
            don’t hesitate to get in touch!</p>
    </div>`
}

✅ you can simplify it

// Get rating elements html collection
const ratingSelectorCollection = document.getElementsByClassName('rating-selector');
// convert rating elements html collection into array
const ratingSelectorArray = Array.from(ratingSelectorCollection);

to this with destructing

const ratingSelectorArray = [...document.getElementsByClassName('rating-selector')]

I hope my feedback will be helpful. You can mark it as useful if so 👍

Good luck and fun coding 🤝⌨️