jquery를 사용하여 여러 요소에서 여러 클래스 제거

Question

이 $ code 및 jsfiddle 링크에 연결된 animate.css는 상자 나 이미지에 애니메이션 효과를 추가합니다.

$('.box1').addClass('animated bounceInUp'); 

에는 애니메이션 클래스와 효과 클래스가 추가됩니다.

$('.box1').removeClass('animated bounceInUp'); 

은 클래스를 제거합니다.

여기에서 문제는 100 개 이상의 상자/이미지를 사용할 계획이므로 모든 애니메이션 및 효과 클래스를 동시에 추가/제거하는 방법이 있어야합니다.

이

내가 현재 사용하고 코드와 jsFiddle입니다 :

jsfiddle

$(document).ready(function() { 
     $('.box1').addClass('animated bounceInUp'); 
     $('.box2').addClass('animated bounceInLeft'); 
     $('.box3').addClass('animated flipInX'); 
     // 
     var wait = window.setTimeout(function() { 
      $('#boxes *').removeClass('animated'); 
     }, 3300); 

    }); 

그러나 이것은 단지 (모든 효과는 다른) 요소에서 애니메이션 클래스를 제거 그래서 당신은 할 수 없습니다 새로운 효과 클래스를 추가하십시오. 나는 '.removeClass ('animated ')'에서 애니메이션으로 추가 할 부분을 파악할 수 없었다. 미리 감사드립니다.

Answer 1

업데이트 : 내가 바로 자바 스크립트 this.className 아무것도 jQuery를 방법보다 빠르고 사용 등

$(function() { 
    $('.box1').addClass('animated bounceInUp'); 
    $('.box2').addClass('animated bounceInLeft'); 
    $('.box3').addClass('animated flipInX'); 
    // 
    var wait = window.setTimeout(function() { 
     $('#boxes > div').each(function(){ 
      this.className = this.className.split(' ')[0]; 
     }) 
    }, 3300); 
}); 

모든 클래스 초기 클래스 .box1, .box2 후 삭제됩니다 클래스 속성을 재 할당하고있다.

#boxes 요소의 모든 직계 하위 divs이 실제로 박스 인 경우 선택자 $('#boxes > div')은 문제가 없습니다.

업데이트 바이올린 :http://jsfiddle.net/rUHpf/18/

Answer 2

당신은 jQuery를 attr 방법을 통해 모든 HTML 태그의 속성을 설정할 수 있습니다. 당신이, 당신이 사용할 수있는 "애니메이션"클래스 아무것도에서 모든 클래스를 제거 할 수 있지만 클래스는 "애니메이션"떠나고 싶다면

다음을 설정하여 다른 모든 클래스를 제거합니다

$(".animated").attr("class", "animated"); 

은 " 일치하는 모든 태그의 "class"속성을 "animated"로 설정합니다.