jQueryでCSSクラスを動的に追加/削除する方法
jQueryには、CSSクラスを動的に追加または削除するための
addClass（）
および
removeClass（）
が付属しています。例えば、
-
$（ ‘＃para1’）. addClass（ ‘highlight’）; – “ハイライト” CSSクラスを追加する
idが “para1″の要素。
-
$（ ‘＃para1’）. removeClass（ ‘highlight’）; – “ハイライト” cssクラスを削除する
idが “para1″の要素から取得します。
例
<html>
<head>
<style type="text/css">
.highlight {
background:green;
}
</style>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
</head>
<body>
<h1>jQuery add/remove css class example</h1>
<p id="para1">This is paragraph 1</p>
<p>This is paragraph 2</p>
<p>This is paragraph 3</p>
<p>This is paragraph 4</p>
<button id="addClass">Add highlight</button>
<button id="removeClass">Remove highlight</button>
<script type="text/javascript">
$("#addClass").click(function () {
$('#para1').addClass('highlight');
});
$("#removeClass").click(function () {
$('#para1').removeClass('highlight');
});
</script>
</body>
</html>
