updating contents of stylesheet with .innerText slow

Question

I have a stylesheet I'm updating the contents of on the fly, based on a user UI. I noticed that in Firefox ( which uses stylesheet.innerHTML ) and IE ( which uses stylesheet.styleSheet.cssText) works well.

It seems that Chrome and Safari ( which use stylesheet.innerText ) run incredibly slow on larger stylesheets. Has anyone run into this and/or found better solutions?

EDIT: It's not possible to use JS to change inline styles since the application never refreshes and the user can switch "pages" thereby nuking the inline styles. Also if I want to use the UI to modify links, I can't use inline to modify pseudo classes such as :hover ( as far as I know )

Answer 1

So this has been my function for updating stylesheets for the past year or so:

function(style, style_value) {

  if ('cssText' in style.styleSheet) {

    // without this line, IE WILL crash, if no stylesheet settings were set
    if ( typeof(style_value) != 'string' || !style_value.length) {
      return;
    }
    style.styleSheet.cssText = style_value;

  }
  else {
    style.innerHTML = style_value;
  }

}