Interactive Rating Component

I'm finding it difficult to properly plan. How do i write cleaner code? With css I'll start off using classes but then I'll use class and element and then id. I need to standardise my code so I'm using the same classes more frequently without creating messy code.

My JS is rough but its the first time i've done it in a while. Is it better to create an onclick event in html or have the js find the element and listen there?

I'm happy it's functional but really want to get to a stage where it is clean and up to industry standard.