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

Question

我尝试执行以下操作：

当我单击一个特定的DIV时，将在另一个DIV中添加/删除CSS类。

在这里查看一个实时示例（然后单击“单击我”）：
http://jsfiddle.net/fyehLqsc/

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

它可以正常工作，但是当我在WordPress网站上执行相同操作时，它就无法工作。

在这里看看：
链接已删除

我要实现的目标：如果有人单击具有“ mejs-play”类的播放按钮，则将“动画”类添加到“ spin-l”和“ spin-r”中。

谁能告诉我为什么它可以在JSFiddle上运行而不在我的网站上运行？

Answer 1

jQuery在wordpress中以noconflict-mode运行，您不能通过$访问它

用这个：

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

---

编辑：

似乎Medialelement库停止了点击事件的传播。

这对我有用：

  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');
    });
  });