Javascript 如何在单击时更改类？

我正在为一个网站编写代码片段，我想在单击时更改类，这与YouTube视频的静音按钮有关

这是我的密码：

    // Sound volume


$('#mute-toggle').on('click', function() {
    var mute_toggle = $(this);

    if(player.isMuted()){
        player.unMute();
        mute_toggle.text('volume_up');
    }
    else{
        player.mute();
        mute_toggle.class('fa fa-volume-off');
    }
});

$('#volume-input').on('change', function () {
    player.setVolume($(this).val());
});

你会看到“静音切换”是一个很棒的字体图标，我希望它在点击时从一个fa音量变为一个fa音量，在我改变它之前，它是.text，它将使用google字体材质图标，因为文本和图标都会改变

如何使用上面的代码在单击时使用JavaScript更改类？ 从fa音量增大（默认）到fa音量关闭

---

必须使用它，因为它使用YoutubeFrame API来控制音量、播放、时间等。但是，如果您知道一个解决方法，它将非常有用。

检查jquery addClass和removeClass函数？

您检查过jquery addClass和removeClass函数吗？mute_toggle.addClass（'fa-volume-off'）我会研究一下，我以前没有使用过jquery，也没有从头开始编写代码，总是使用模板或代码段。我写过如何添加类，我也有同样的想法。。谷歌“jquery addclass”获取更多信息/代码片段谢谢，它工作得很好。工作得很好，希望我不要再问这样愚蠢的问题，谢谢你的快速回答，我会在几分钟后检查答案，最终代码在这里：

    $('#mute-toggle').on('click', function() {
    var mute_toggle = $(this);

    if(player.isMuted()){
        player.unMute();
        mute_toggle.text('volume_up');
    }
    else{
        player.mute();
        mute_toggle.addclass('fa-volume-off'); 

  /* this adds class where #mute_toggle, also you need to add manually .fa class  */
  /*** or add this line to your code  ***/

  /*    mute_toggle.addclass('fa');   */


    }
});

$('#volume-input').on('change', function () {
    player.setVolume($(this).val());
});