jQuery Item Filter plugin

jQuery Item Filter plugin

Select filters button and call webToolsFilter('sortableElementClass') and pass sortable elements class.
Example:
HTML markup
#filters button
<ul class="works__filters">
  <li class="active-filter" data-category="all">All</li>
  <li data-category="illustration">Illustration</li>
  <li data-category="graphics">Graphics</li>
  <li data-category="video">Video</li>
  <li data-category="web">Web</li>
</ul>

#filters data
<ul>
  <li class="col-md-4 sortable" data-category="video">
    <img src="img/works1.jpg" alt="works example image">
  </li>
  <li class="col-md-4 sortable" data-category="web">
    <img src="img/works2.jpg" alt="works example image">
  </li>
</ul>

#js code
$('.works__filters li').webToolsFilter('sortable');

webToolsFilter.js

$.fn.webToolsFilter = function(sortClass) {
  $(this).click(function() {
    $(this).addClass('active-filter')
      .siblings()
      .removeClass('active-filter');
    const currentFilter = $(this).attr('data-category');
   if (currentFilter === 'all') {
      $('.' + sortClass).css('opacity', 1).fadeIn(600);
      return;
    };

    $('.' + sortClass + '[data-category=' + currentFilter + ']').hide();

    $('.' + sortClass).css('opacity', 0).show();

    $('.' + sortClass + '[data-category!=' + currentFilter +']')
      .css('opacity', 0.4)
      .fadeOut(600);

    $('.' + sortClass + '[data-category=' + currentFilter +']')
      .css('opacity', 1)
      .show()
      .animate({
      left: '30px',
      top: '30px'
    }, 600, function() {
        $(this).css({
          left: 0,
          top: 0
        })
      });
    });

}