클래스 onclick을 변경하는 방법?

Question

이 코드는 원격 텍스트 버튼을 허용하는 soundcloud의 위젯과 함께 작동하며 txt_on_pause txt_on_play가 아닌 선택한 클래스에 따라 다른 그림이 일시 중지/재생되는 하나의 이미지 버튼에 대해 원격으로 작동하도록합니다. 어떻게 토글하는 방법에 대한 아이디어? 일을해야 addClass 및 removeClass 기능을 사용

$(function() { 
    var widgetIframe = document.getElementById('sc-widget'), 
     widget = SC.Widget(widgetIframe), 
     txt_on_pause = '¡Escuchar música!', 
     txt_on_play = 'Escuchando algo de música... (click para pausar)'; 
    widget.bind(SC.Widget.Events.READY, function() { 
     $(".sc-toggle").html(txt_on_pause); 
    }); 
    widget.bind(SC.Widget.Events.PAUSE, function() { 
     $(".sc-toggle").html(txt_on_pause); 
    }); 
    widget.bind(SC.Widget.Events.PLAY, function() { 
     $(".sc-toggle").html(txt_on_play); 
    }); 
    $(".sc-toggle").click(function (e) { 
     e.preventDefault(); 
     widget.toggle(); 
    }); 
}); 

Answer 1

.

$(function() { 
    var widgetIframe = document.getElementById('sc-widget'), 
     widget = SC.Widget(widgetIframe), 
     txt_on_pause = '¡Escuchar música!', 
     txt_on_play = 'Escuchando algo de música... (click para pausar)'; 

    widget.bind(SC.Widget.Events.READY, function() { 
     $(".sc-toggle") 
      .removeClass('pause') 
      .removeClass('play') 
      .addClass('ready')); 
    }); 
    widget.bind(SC.Widget.Events.PAUSE, function() { 
     $(".sc-toggle") 
      .removeClass('play') 
      .removeClass('ready') 
      .addClass('pause'); 
    }); 
    widget.bind(SC.Widget.Events.PLAY, function() { 
     $(".sc-toggle") 
      .removeClass('pause') 
      .removeClass('ready') 
      .addClass('play'); 
    }); 
    $(".sc-toggle").click(function (e) { 
     e.preventDefault(); 
     widget.toggle(); 
    }); 

});