jQuery : 여러 버튼을 사용하여 하나의 클래스 변경

Question

여러 버튼을 사용하여 div의 배경색을 변경하려는 경우, 지금까지 작성한 코드가 .eaStaff 컨테이너 div에 더 많은 클래스를 계속 추가합니다. 그 (것)들을 토글하는보다는 오히려 .attr를 사용하여 원래 시도했다 그러나 .attr를 사용하여 클래스를 유지할 필요가있다 .attr는 제거했다/그 종류 대체했다.

FIDDLE

//BG COLOUR 
$('.bg a').click(function (e) { 
    e.preventDefault(); 
    console.log('dd', $(this).data('class')) 
    $('.eaStaff').toggleClass($(this).data('class')); 
}); 

Answer 1

전환 클래스가 제거 또는 요소에 특정 클래스를 추가하거나, 그렇지 분명히 다른 클래스 않습니다. 대신 클래스를 추가하기 전에 다른 클래스를 제거 할 수 있습니다.

$('.eaStaff').removeClass('transBG darkBg lightBg'); 
$('.eaStaff').addClass($(this).data('class')); 

https://jsfiddle.net/p34r7m87/5/

완벽한, 그래서 가까운하지만 너무 멀리