動的なCSS生成　スタイルシートを追加してスタイルルールを追加すると、jQueryの.css()では上書きできない

　JavaScriptでスタイルシートやスタイルルールを追加する。動的にCSSを生成ってやつ。それでハマった話。
　追加方法はこんな感じ。IEだとcreateStyleSheet();で、それ以外（FirefoxやChrome、Safariなど）では、createElement(‘style’)して、appendChild()する。これでスタイルシートを追加。スタイルルールの追加は、IEならaddRule()、それ以外ならinsertRule()。なんとかうまくできた。参考にしたのはこのへん。

　既存のスタイルシートの最後にルールを追加する、という方法をとっていたのだけど、スタイルシートがない場合とか、あってもスタイルルールが存在しない場合は上記のサンプルではうまくいかなかったので、いろいろな処理を考えた。結局、まずスタイルシートを追加する、という方法に落ち着くことに。
　ここまではよかった。
　続いて。スタイルルールはスタイルシートに追加していく。ここまでの処理は、ある操作をするたびに行われる。ボタンを押すと発動、って感じだ。シンプルでいい考えだと思ったのけども（増えすぎてメモリを使いまくる、ということは後で考えようと思ってた）。
　途中で不要になったルールを削除しようとして、いつものjQueryの.css()で上書きして消そうと思ったのだが（本体はjQueryを使わないけど、プログラムの動作を決める設定用プログラムはjQuery使用OKというシバリなのだ）。やってみたのは、こんな感じ。
　$(“.example”).css(“color”, “”);
　これでは上書きできない。スタイルシートが累積されてて（この表現は違う気がするけど、一応）、こんな単純な方法では上書き＝削除できないのだった。
　というわけで、スタイルシートを動的に追加し続けていくと意図しない事態が発生するという結果に気づく。考えてみれば当たり前だけど、気づくのに時間がかかった。どうしたもんだろう。
　カンタンに考えれば、追加したスタイルシートを削除すればいい。それがまたすぐには思いつかなかった。こんな感じ。
　$(“head style”).last().remove(); //最後のシートを削除
　headタグの下のstyleタグの最後の要素を削除するだけ。もちろん、追加回数をカウントして最初はこれをしない（最初はカウントを間違えて、全部のCSSが消えてびっくりした）。
　まだまだ勉強が必要だ。今後のためにメモ。まったくまとまりのない文章になってしまったけど。