만약 전체 클래스를 모두 제거했다가 다시 추가하려면 어떻게 할까요? 제이쿼리의 toggleClass()를 사용할 수 있습니다. 아래는 예제코드입니다.

<div class="active hover focus">Toggle Test</div>

이제 위 클래스를 모두 제거합니다. 이때 toggleClass()의 메소드를 빈값으로 실행합니다.

$('div').toggleClass();

! html code
<div class>Toggle Test</div>

toggleClass()를 빈값으로 전달할 경우 모든 Class 이름이 제거됩니다. 이를 다시 수행하면 어떻게될까요? 아래 래를 봐주세요.

$('div').toggleClass();

! html code
<div class="active hover focus">Toggle Test</div>
다시 똑같이 실행할 경우 toggleClass() 메소드는 기존의 class들을 기억해두었다가 toggle하여 append해줍니다. 매우 간단하죠

code snippet widget