Visual Composer + JS =不执行代码

Question

我有一个奇怪的问题。我正在尝试向我的wordpress页面应用一段代码，它在codepen中完美运行。你可以在这里找到它：

https://codepen.io/anon/pen/rzmWVE

JS代码：

jQuery(document).ready(function( $ ) {

        var vid = document.getElementById("bgvid");
        var pauseButton = document.querySelector("#btnplay");

        if(pauseButton) pauseButton.addEventListener("click", function() {
          if (vid.paused) {
            vid.play();
            $(".hide-section").fadeOut();
          } else {
            vid.pause();
            $(".hide-section").fadeIn();
          }
        });

        $('#videoreplay').click(function () {
        var vid = document.getElementById("bgvid");
        vid.currentTime = 0;
        });

    $(".notice1, .notice2, .notice3, .notice4, .notice5, .notice6, .notice7").hide();

       $("#cairns").hover(function(){ 
       $(".notice1").show();
     },function(){
       $(".notice1").hide();
   });

       $("#brisbane").hover(function(){ 
       $(".notice2").show();
     },function(){
       $(".notice2").hide();
   });

       $("#perth").hover(function(){ 
       $(".notice3").show();
     },function(){
       $(".notice3").hide();
   });

       $("#goldcoast").hover(function(){ 
       $(".notice4").show();
     },function(){
       $(".notice4").hide();
   });

       $("#sydney").hover(function(){ 
       $(".notice5").show();
     },function(){
       $(".notice5").hide();
   });

       $("#melbourne").hover(function(){ 
       $(".notice6").show();
     },function(){
       $(".notice6").hide();
   });

       $("#adelaide").hover(function(){ 
       $(".notice7").show();
     },function(){
       $(".notice7").hide();
   });
});

我的错误是这段代码不能在真实的网站上运行？我正在努力：

  

$（“。notice1，.notice2，.notice3，.notice4，.notice5，.notice6，   .notice7" ）隐藏（）;

直到代码结束。

作曲家只是忽略了......我不明白为什么。你能帮我解决这个问题吗？感谢..