set style with :hover javascript

Question

I understand that the following method is great for setting CSS styles because of browser compatibility.

element.style.cssText = \"color:red;\";

<

Answer 1

You can do it with some Voodoo magic:

var head = document.getElementsByTagName('head')[0];
var style = document.createElement('style');
var declarations = document.createTextNode('selector:pseudo { property: value }');

style.type = 'text/css';

if (style.styleSheet) {
  style.styleSheet.cssText = declarations.nodeValue;
} else {
  style.appendChild(declarations);
}

head.appendChild(style);

Not exactly what you needed, but you can tweak it and make a fancy function out of it if you want.