jQuery で要素のCSSを変更する方法

jQueryで要素のCSSを変更するには「css」にプロパティ名と値を設定します。

要素.css(プロパティ名,値);

例）$("p").css("background","red");

jQuery + JavaScript ソース

「test-botan3」というIDが付いた要素をクリックすると「sample27」というIDが付いた要素の背景色をCSSで黄色に変更しています。 

<script type="text/javascript">
    $(function(){
        $("#test-botan3").click(function(){
            $("#sample27").css("background","yellow");
        });
    });
</script>

HTML

HTMLは「input」要素と「div」要素で構成されています。 

<p><input id="test-botan3" type="button" value="BUTTON" /></p>
<div id="sample27">上のボタンを押すとこのテキスト行の背景色が黄色に変更されます。</div>

サンプルの実行 

ボタン「BUTTON」を押すとボタンの下にあるテキスト行の背景色が黄色に変更されます。 

結果

上のボタンを押すとこのテキスト行の背景色が黄色に変更されます。

END