在jQuery中創建一個新的（permenant）CSS樣式

Question

我想創建一個新樣式，而不僅僅是改變元素的樣式屬性。下面是一些示例代碼來演示該問題：

//Create 1st element 
var element1 = $('<div />').text('element1').addClass('blue'); 
$('body').append(element1); 

//Set some css for all elements with the blue class 
$('.blue').css('background-color', 'blue'); 

//Create 2nd element, it won't have the css applied because it wasn't around when the css was set 
var element2 = $('<div />').text('element2').addClass('blue'); 
$('body').append(element2);​ 

在第二個元素上面的代碼不具有相同的風格爲1日。我想要的是能夠爲所有將來的元素在className上設置css。

JSFiddle

Answer 1

您可以創建一個新的樣式表，並把這段頭：

$("<style type='text/css'> .blue{ background-color:blue;} </style>").appendTo("head"); 

見演示：http://jsfiddle.net/YenN4/2/

Answer 2

演示：的http://jsfiddle.net/T6KEW/

$('<style>').text('.blue { background: blue }').appendTo('head'); 

$('<div>').text('element1').addClass('blue').appendTo('body'); 
$('<div>').text('element2').addClass('blue').appendTo('body');​