Classes vs. IDs: I generally have very few IDs on a page, if any. I use class names as styling hooks, and either class names or data-* attributes as JS hooks.
I’ve found this to be true more and more.
How often is it that you need to target a single object…and even if you did, you’d want the JS to be re-usable.
That’s the inherent problem with IDs…they’re unique…and modern web development processes are all about flexibility and extendability.
If I can write (in my poor way) a JS/JQ function with an ID..it just makes sense to use a data attribute instead and it’s instantly re-usable.