Interactive Rating Component

For the active states, I ended up using the :active css selector. However, this only works if I hold click on the rating value.

Would I need to rewrite the div for ratings into a checkbox instead? Or is there a way to make it remember the click.

Sorry if I explained poorly, but I'm referencing the active-state.jpg in the design folder. The number 4 was previously selected, while 5 is being hovered.

Thank you for any help and any other advice you might have.