Question

Is it possible to define a class with specific style attributes dynamically with jQuery, rather than setting the style of all elements with that class?

I could set the attributes of the class at the end of the script once all the elements have been created, but is that the best way to go about it? If I define the style of the class with $('.class').css('property','value'); at the beginning of the script, nothing would happen because the elements with class .class haven’t been created yet, right?

Answer 1

The proper way to do that is to use CSS. If you want elements with class “foo” to have a bunch of properties, then put those properties in a CSS file and associate them with an appropriate selector:

.yourClass {
  font-weight: bold;
  color: green;
}

If you need to do this dynamically, it’s possible to write CSS blocks with Javascript. Put a <style> element in your page and give it an “id” value:

<style id='dynamicStyle'></style>

Then you can set it with jQuery:

$('#dynamicStyle').text(".yourClass { font-weight: bold; }");