I have seen rather complex code out there for style sheet swapping in web browsers through JavaScript, and just found out a much simpler way works.
I could have sworn I tried to do real-time style sheet swapping a very long while back and none of my tests turned out satisfactorily, but a friend was just asking me about it, and I was redoing the tests, and it all worked out perfectly in an incredibly easy fashion in IE 6 & 7 and Firefox 2.5 & 3. All that needs to be done is swap the href of the link object pointing to the external style sheet file.
<link href="OLDSTYLESHEET.css" rel=stylesheet type="text/css" id=MyScriptSheet>
<input type=button onclick="document.getElementById('MyScriptSheet').href='NEWSTYLESHEET.css'">
Adding style sheets by dynamically inserting HTML via JavaScript seemed to work just fine too.
document.body.innerHTML+='<link href="NEWSTYLESHEET.css" rel=stylesheet type="text/css">';
