How can I change the style of multiple elements using jQuery?

I have one CSS style sheet with rules like this:

h1, h2, h3, h4, .contentheading, .title{

 font-size: 13px ;
 font-weight: normal;
 font-family: Arial, Geneva, Helvetica, sans-serif ;
}

The tags, 开发者_高级运维classes are generated by plugin so i can't add a single class to it.

So, is there any way that I can change the styles of all elements at once, at runtime, that doesn't involve going through them one by one?

You can do multiple selectors in jQuery just like in Css. Maybe not the best performance-wise but will work.

$('h1, h2, h3, h4, .contentheading, .title').css('color', 'red');
$('h1, h2, h3, h4, .contentheading, .title').addClass('someOtherClass');

This is very simple with jQuery. Simply use the selectors in question as your jQuery selectors, then change the css. So the JavaScript/jQuery code would be this, assuming you wanted to change the font-size and font-weight:

$('h1, h2, h3, h4, .contentheading, .title').css({
  'font-size': '17px',
  'font-weight': 'bold'
});

It sounds like you're new to jQuery, you probably want to get familiar with the docs and api sites.

In CSS:

* {
    font-size: 13px;
    font-weight: normal;
    font-family: Arial, Geneva, Helvetica, sans-serif;
}

$('h1,h2,h3,h4,.contentheading,.title').css({ 'color': '#fff' });

Since this question is tagged jQuery, using the * selector should help you to get all elements. Then you can use the css method to change the styles.

$('*').css();

In CSS you can just use the same * selector to apply some styles to all elements, but make sure you put it last of the CSS file so as to override all other rules.

* {
    font-size: 13px;
    font-weight: normal;
    font-family: Arial, Geneva, Helvetica, sans-serif;
}