Il metodo addClass() di jQuery
Il metodo .addClass() associa una classe agli elementi selezionati nel DOM tramite il selettore.
.addClass()
Ad esempio, in questo script associo la classe prova ai tag <p> del documento tramite il selettore $("p").addClass("prova");
<!DOCTYPE html>
<html>
<head>
<style>
#box { width:100px; height:100px; text-align:center; background:#f00; font-size:14px; }
#clickme { width:100px; border:1px solid #000; }
.prova { color:red; }
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div id="clickme">Click here</div>
<p>A</p>
<p>B</p>
<p>C</p>
<script>
$( "#clickme" ).click(function() {
$("p").addClass("prova");
});
</script>
</body>
</html>
Quando l'utente clicca sull'id=clickme, il selettore $("p").addClass("prova") associa la classe .prova a tutti gli elementi <p> del documento.
A sua volta la classe .prova colora di rosso il testo contenuto nei tag <p>.
Il metodo addClass() aggiunge automaticamente la classe "prova" a tutti gli elementi selezionati.
Quindi, non occorre eseguire un ciclo per associare la classe a ogni elemento della selezione.
E così via.
