JQuery Конфликт между 2 отдельными кодами

Question

Я использую плагин quicksand для фильтрации своих элементов портфолио, но когда я помещаю этот #w div в динамический загрузчик контента, он перестает работать (я имею в виду фильтры. Если вы нажмете на них, ничего не произойдет), как вы можете видеть здесь

и это рабочий пример страницы моего портфолио в загрузчике контента.

элементы моего портфолио -html;

  <div id="w">
    <center><div class="sort" id="sort"><span class="label">Filter By:</span> <a href="#" class="all selected">All</a> <a href="#" class="web">Web</a> <a href="#" class="ios">iOS</a> <a href="#" class="print">Print</a></div></center>


    <ul class="portfolio clearfix">

      <li data-id="id-1" data-lightbox="example-set" class="ios"><a class="example-image-link" href="../img/image-3.jpg" data-lightbox="example-set" title="pic1 lorem ipsum dolar bitch!"><img  src="images/ios-app-ui-01.png" class="portimg"></a></li>


              <li data-id="id-2" data-lightbox="example-set" class="ios"><a class="example-image-link" href="../img/image-6.jpg" data-lightbox="example-set" title="pic2 lorem ipsum dolar bitch!"><img  src="images/print-design-cards.png" class="portimg"></a></li>



      <li data-id="id-3" class="ios"><a href="" target="_blank"><img src="images/ios-app-ui-02.png" class="portimg"></a></li>

      <li data-id="id-4" class="print"><a href="" target="_blank"><img src="images/print-winery-card.png" class="portimg"></a></li>

      <li data-id="id-5" class="web"><a href="" target="_blank"><img src="images/website-layout-header.png" class="portimg"></a></li>

      <li data-id="id-6" class="web"><a href="" target="_blank"><img src="images/website-base-header.png" class="portimg"></a></li>

      <li data-id="id-7" class="print"><a href="" target="_blank"><img src="images/print-cyan-announcement-cards.png" class="portimg"></a></li>

      <li data-id="id-8" class="web"><a href="" target="_blank"><img src="images/website-logo-header-image.png" class="portimg"></a></li>

      <li data-id="id-9" class="ios"><a href="" target="_blank"><img src="images/ios-ipad-app-03.png" class="portimg"></a></li>

      <li data-id="id-10" class="ios"><a href="" target="_blank"><img src="images/ios-tabbar-app-04.png" class="portimg"></a></li>

      <li data-id="id-11" class="web"><a href="" target="_blank"><img src="images/website-dropdown-nav-menu.png" class="portimg"></a></li>

      <li data-id="id-12" class="web"><a href="" target="_blank"><img src="images/website-restaurant-navigation-icons.png" class="portimg"></a></li>

      <li data-id="id-13" class="ios"><a href="" target="_blank"><img src="images/ios-app-ui-05.png" class="portimg"></a></li>

      <li data-id="id-14" class="web"><a href="" target="_blank"><img src="images/website-footer-layout-design.png" class="portimg"></a></li>

      <li data-id="id-15" class="web"><a href="" target="_blank"><img src="images/website-shop-flowers-navigation.png" class="portimg"></a></li>
    </div>

код загрузчика контента:

    .
    .
    . 
    //FUNCTION: DONE LOADING
    function jqc_fnDone()
    {
        $("#jqc_content").animate({ height: 'show' }, 500);
        $("#jqc_loading").fadeTo(1000, 0);
        jqc_intInterval = setInterval(jqc_fnLoop, jqc_vDuration);


     //quicksand filter code:


      var pclone = $(".portfolio").clone();

      $("#sort a").on("click", function(e){
        e.preventDefault();
        var sorttype = $(this).attr("class");

        // determine if another link is selected
        if(!$(this).hasClass("selected")) {
          $("#sort a").removeClass("selected");
          $(this).addClass("selected");
        }

        // check filter sort type
        if(sorttype == "all") {
          var filterselect = pclone.find("li");
        } else {
          var filterselect = pclone.find("li[class="+sorttype+"]");
        }

        $(".portfolio").quicksand(filterselect, 
        {
          adjustHeight: 'auto',
          duration: 550
        }, function() { 
          // callback function
        });
      }); // end click event listener
        if($('#map-canvas').length && !$('#map-canvas div').length){initialize();}
    };

    });

Answer 1

Явно ID или class с тем же именем существует в обоих ваших плагинов jquery. Никто не найдет это для вас. Поэтому попробуйте ограничить количество плагинов jquery, которые у вас есть.