@ PHP

addClass() removeClass():class属性の追加と削除

class 属性は他の属性と違ってスペース区切りで複数の値を設定できます。
このため、class 属性の操作には専用の命令が用意されていいます。

class属性の追加

class 属性を追加するには addClass() を使います。引数に追加したい class 属性値を記述します。複数の class 属性をスペース区切りで追加できます。

addclass.html

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title>sample</title>
<style>
.red {
  color: red;
}
</style>
</head>

<body>
  <p>テキストテキスト</p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(function() {
  $("p").addClass("red")
});
</script>
</body>

</html>

demo

class属性の削除

class 属性の削除には removeClass() を使います。引数に削除したい class 属性を記述します。複数の class 属性をスペース区切りで記述できます。

removeclass.html

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title>sample</title>
<style>
.red {
  color: red;
}
</style>
</head>

<body>
  <p class="red">テキストテキスト</p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(function() {
  $("p").removeClass("red")
});
</script>
</body>

</html>

demo