CSS dynamic name names? How to add them to a CSS file?

Question

I have DIV identifiers in the application that are generated dynamically, with an identifier at the end. For example: <div id="vote_score_72"> , <div id="vote_score_73"> , <div id="vote_score_74"> and so on.

How can I write this identifier in a CSS file so that I can apply a style to it?

Answer 1

In addition to assuming that you should use classes for this functionality (and you should), you can instead use the attribute-value-starts-with selector (this may not be a formal name):

 div[id^=vote_score] { color: #f00; /* and so on... */ } 

JS Fiddle demo .

---

Edited to add a link to the Quirksmode.org compatibility table for advanced attribute selectors .

Literature:

• CSS3 Selector Attributes on Sitepoint.com .
• Attribute selectors in CSS3.info
• Attribute selectors on the Mozilla Developer Network .

Answer 2

You must add a generic class to all of these elements and use this class in your CSS.

Classes are the best way to handle a common style for different elements.