Interactive rating component Solution

Hi Suraj,

I looked at your code, although the functionality is achieved, you have 5 functions that are essentially the same. You can make this much DRY-er by writing a function with event target as the variable! Try adding just one event listening on all your mark <span>s

*function: *

const selectRating = (e) => {
    styleSelector();
    let mark = e.target.id
    let markValue = e.target.innerHTML
    mark.classList.add("rateSelect")
    rate.innerHTML = `you selected ${markValue} out of 5`;
}

add eventlistener to all marks:

allMarks.addEventListener("click", selectRating(e))

hope this helps!

I would advise you to make it responsive😅. However nice job!