I am using the Isotope filter by category for the WordPress posts. Often the posts are the children of the filtered categories so their classes contain the parent’s category name in the name of the class but not equal to this name. For example, the filters are Facebook, Twitter, Youtube. And the class name is facebook-pages or twitter-infographics. So these posts are not being filtered, unless the parent category is checked as well. The code I use now is the following (the jQuery non-conflict mode):

var $jcontainer = $j('#portfolio-list');
$jcontainer.imagesLoaded( function() {
// initialize isotope
$jcontainer.isotope({
  filter: '*',
  itemSelector : '.post',
  layoutMode : 'masonry',
});
});

$j('#portfolio-filter a').click(function(){
    $j('#portfolio-filter .current').removeClass('current');
    $j(this).addClass('current');

    var selector = $j(this).attr('data-filter');
    $jcontainer.isotope({
        filter: selector,
     });
     return false;
}); 

I would like to know how to get it work by the part of the text of the class. Thank you for any help.

Solution

After some research I found the solution. I realized that I can use .match function to check the class before filtering, and then to assign a class “.match” to each matched element. Then just to filter by this class!) Here is the code. Hope it will help to somebody!

// cache container
var $jcontainer = $j('#portfolio-list');
$jcontainer.imagesLoaded( function() {
// initialize isotope
$jcontainer.isotope({
  filter: '*',
  itemSelector : '.post',
  layoutMode : 'masonry',
});
});

$j('#portfolio-filter a').click(function(){
    $j('#portfolio-filter .current').removeClass('current');
    $j('#portfolio-list .match').removeClass('match');
    $j(this).addClass('current');
    var selector = $j(this).attr('data-filter');
    $j('#portfolio-list article' ).each(function() {
       if ($j(this).attr('class').match(new RegExp(selector))) {
        $j(this).addClass('match');
    }
    }); 

    $jcontainer.isotope({
        filter: '.match',
     });
     return false;
});