Javascript 使用jQuery在单击时切换CSS类不起作用

我试着做到以下几点：

当我点击一个特定的DIV时，就会从另一个DIV中添加/删除一个CSS类

在这里查看一个实时示例（并单击“单击我”）：

它正在正常工作，但当我在WordPress网站上做同样的事情时，它就不工作了

看看这里：
链接已删除

我想要实现的是：如果有人点击播放按钮，该按钮的类为“mejs play”，那么“animated”类将添加到“spin-l”和“spin-r”中

---

有人能告诉我为什么它在JSFIDLE上工作，而不是在我的站点上吗？

jQuery在wordpress中以无冲突模式运行，您不能通过

$

使用以下命令：

   jQuery(document).ready(function($) {
    $(".mejs-play").click(function () {
      $(".spin-l").toggleClass("animated");
      $(".spin-r").toggleClass("animated"); 
    });
   });

---

编辑：

看起来Medialelement库停止了click事件的传播

这对我很有用：

  jQuery(document).ready(   function ($) { 
    $('audio').on('play pause',function(e){  
      $(this).closest('.current-cast').prevAll('.cassette').last()
      .find(".spin-l,.spin-r").toggleClass("animated",e.type==='play');
    });
  });

---

你在你的wordpress站点上的document.ready函数上发现了一个脚本错误，所以基本上它甚至没有执行toggleClass函数，因为它控制着永远不会进入那个点，我该怎么做才能解决这个问题？很抱歉，我对这些事情一无所知。谢谢你，现在我再也没有收到错误了，但当点击按钮时，它仍然没有旋转。我在我的WP网站上编辑的。你是我的英雄。非常感谢你的帮助！祝你圣诞快乐。：）为了你和你的朋友！

  jQuery(document).ready(   function ($) { 
    $('audio').on('play pause',function(e){  
      $(this).closest('.current-cast').prevAll('.cassette').last()
      .find(".spin-l,.spin-r").toggleClass("animated",e.type==='play');
    });
  });