Creating a CSS class in jQuery

Question

I believe the .addClass() function in jQuery attaches a CSS class to the current selection, but I was wondering I could create or define a CSS class in jQuery, and then attach it?

Answer 1

Actually, you can create a CSS rule that will affect all elements on the current page. In most browsers it should be as simple as:

var style = $('<style>body { background: green; }</style>') $('html > head').append(style); 

This may or may not work in IE, however you can use IE's proprietary addRule instead:

document.styleSheets[0].addRule('body', 'background: green', -1); 

Naturally this will not assist you in creating css files that can be shared between webpages, but it is a handy way of affecting the style of a large number of elements without the need to iterate over them.

Answer 2

I'm not exactly sure what you want, but I think the best you can do is something like this:

var someClass = { "width": "100%", "background": "#ffffff" }; $(this).css(someClass); 

Note that this is not actually creating a class, but it might do what you need.