I use quicksand plugin to filter my portfolio items but when I put this #w div into my dynamic content loader it's stopped working.(I mean the filters. If you click on them; nothings happen.) as you can see here
and this is the working sample of my portfolio page -out of the content loader.
my porfolio items -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>
content loader code:
.
.
.
//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();}
};
});
Clearly an ID or a class with the same name is existant in both of your jquery plugins. No-one is going to find this for you. So try limiting the number of jquery plugins you have.