jQueryを用いてHTMLで書かれた要素を後から変更をかけたいということが、よくあります。本件ではスタイルを変更するために、クラスを追加するサンプルを用意しました。
当然ですが、スタイルを変更したい場合は、単純にスタイルシートを上書きすることが描画の上で最速になります。
ここではあえて、HTMLの全ての描画が終わった後でClassを追加してスタイルを変更する方法を紹介します。
サンプルはこちら
この部分のスタイルを変える
<div id="demo_1">この部分のスタイルを変える</div><style>
.demo_class{
color:#FFF;
background-color:#000;
}
</style>IDに対してクラスを追加します。
<script>
$(document).ready(function(){
var my_id = "#demo_1";
var my_class = "demo_class";
$(my_id).addClass(my_class);
});
</script>
