.addClass(className) vráti: jQuery
Pridáva špecifickú triedu/triedy, všetkým vybraným elementom.
Je dôležité poznamenať, že táto metóda nenahrádza triedy. Jednoducho pridá triedu, alebo sa pripojí k ostatným už existujúcim, zvoleného elementu.
Element môže obsahovať viac než jednu triedu súčasne, oddelené medzerou takto:
$('p').addClass('myClass yourClass');
Táto metóda je často využívaná s .removeClass() na prepínanie tried elementu z jednej na druhú takto:
$('p').removeClass('myClass noClass').addClass('yourClass');
Triedy myClass a noClass sú odstránené zo všetkých odstavcov, zatiaľ čo im pridá triedu yourClass.
jQuery 1.4, .addClass() metóda nám umožňuje ako nastaviť triedu vo funkcii.
$('ul li:last').addClass(function() {
return 'item-' + $(this).index();
});
Vzhľadom na neusporiadaný zoznam s piatimi <li> elementami, tento príklad pridá poslednému <li> triedu "item-4".
Priklady:
Prida triedu 'selected' pre zvolene elementy.
<!DOCTYPE html>
<html>
<head>
<style>
p { margin: 8px; font-size:16px;
.selected { color:blue; }
.highlight { background:yellow; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<p>Hello</p>
<p>and</p>
<p>Goodbye</p>
<script>$("p:last").addClass("selected");</script>
</body>
</html>
Prida triedy selected a highlight zvolenym elementom.
<!DOCTYPE html>
<html>
<head>
<style>
p { margin: 8px; font-size:16px; }
.selected { color:red; }
.highlight { background:yellow; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<p>Hello</p>
<p>and</p>
<p>Goodbye</p>
<script>$("p:last").addClass("selected highlight");</script>
</body>
</html>
