Add CSS rule via jQuery for future created elements

When you plan to remove elements from the DOM to re-insert them later, then use .detach() instead of .remove().

Using .detach() will preserve your CSS when re-inserting later. From the documentation:

The .detach() method is the same as .remove(), except that .detach() keeps all jQuery data associated with the removed elements. This method is useful when removed elements are to be reinserted into the DOM at a later time.


This should work:

var style = $('<style>.class { background-color: blue; }</style>');
$('html > head').append(style);