appendChild on a <style> element fails on IE and you get an "unknown error" if you try to modify it's innerHTML. I haven't found any workaround.
Use this to add styles: //addStyles 0.1 // Ricardo Tomasi < ricardobeat at gmail com > // Licensed under the WTFPL - http://sam.zoy.org/wtfpl/ function addStyles(rule){ var sheet = document.styleSheets[0], ln = (sheet.cssRules||sheet.rules).length; if (sheet.addRule) { rule = rule.match(/(.*){(.*)}/); sheet.addRule(rule[1],rule[2], ln); } else { sheet.insertRule(rule, ln); }; return arguments.callee; }; addStyle("#div{display:none}"); the 'return arguments.callee' line is there to allow for some funky construction, you can remove it if you want: addStyle ('div { background: xxx }') ('.menu { whatever: #45 }') ('.hold { float: left }') This script will insert rules at the end of the stylesheet, that's important so that you can override earlier styles. cheers, - ricardo On Jan 15, 8:07 am, Ant <kalli...@gmail.com> wrote: > Hi, > Yea, I went for adding a new style element for every new style, which > works, but isn't as neat as I was hoping for. > I was trying to append a string into the style element: > HTML > <style type="text/css"> > body{color:#333;} > </style> > JS > $("style").append("#content{color:#f00;}"); > In Firefox, this adds #content(color:#f00;} beneath the body > declaration. > Which is what I would expect to happen. > In IE I get an error thrown in jquery-1.3b2.js > > It may well be that my expectations of append are wrong, if so, it > would be a useful thing for me to know as I am quite new to jQuery. > Many thanks for your time, > Ant > > Ricardo Tomasi wrote: > > What are you trying to append? You can only append textnodes to a > > style element. > > > Why not use the stylesheet object directly: > > > document.styleSheets[0].insertRule("#wrapper {display:none}", 0) // > > 'addRule' on IE > > > Or, for a hassle-free alternative, create a new style element for it: > > > $('<style type="text/css"></style>').text(myClass).appendTo('head'); > > > On Jan 14, 12:05 pm, Ant <kalli...@gmail.com> wrote: > > > Hi, > > > I am trying to append css into a pre existing style element. > > > $("style").append(myClass); > > > This works as expected in Firefox, but not IE. > > > The HTML on the page validates to HTML strict, so I'm fairly sure that > > > it's not the issue with IE that append() won't work on incorrectly > > > written elements. > > > If I change my code to $("p").append(myClass); it works as expected. > > > > Was just wondering if this is a know issue with IE or jQuery and if > > > anyone had a work around, I am out of ideas that don't involve > > > considerable effort :) > > > > Thanks, > > > Ant