title: jQuery isotope filter issue when used with form select
body: <p>I am trying to use jquery isotope filtering, to on-page filter HTML blocks, containing 2 parameters each:
  class-1
  class-2</p>
  
  <p>When I am using buttons to filter by class-1, it works.
  But when i additionally add class-2 in HTML blocks &amp; try to filter by another dropdown select, it doesnt work. M stuck, wondering where m making error ?</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div id="filters" class="button-group"&gt;
  &lt;div class="col-md-6"&gt; 
   &lt;ul&gt;
  &lt;li&gt;&lt;button class="button is-checked" data-filter="*"&gt;All&lt;/button&gt;&lt;/li&gt;
  &lt;li&gt;&lt;button class="button" data-filter=".1"&gt;One only&lt;/button&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;&lt;!--------col-md-6 ends here--------------------&gt;
  
  &lt;/div&gt;&lt;!-------/#filter ends here----------&gt;
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$( document ).ready( function() {
    // init Isotope
  var $container = $('.isotope').isotope({
  itemSelector: '.class-1',
  layoutMode: 'fitRows',
  getSortData: {
    name: '.name',
    symbol: '.symbol',
    number: '.number parseInt',
    category: '[data-category]',
    weight: function( itemElem ) {
      var weight = $( itemElem ).find('.weight').text();
      return parseFloat( weight.replace( /[\(\)]/g, '') );
    }
  }
    });
  
  
    // bind filter button click
    $('#filters').on( 'click', 'button', function() {
  var filterValue = $( this ).attr('data-filter');
  // use filterFn if matches value
  filterValue = filterFns[ filterValue ] || filterValue;
  $container.isotope({ filter: filterValue });
    });
  
   // change is-checked class on buttons
    $('.button-group').each( function( i, buttonGroup ) {
  var $buttonGroup = $( buttonGroup );
  $buttonGroup.on( 'click', 'button', function() {
    $buttonGroup.find('.is-checked').removeClass('is-checked');
    $( this ).addClass('is-checked');
      });
    });
  
  });
  </code></pre>
  
  <p>Up to here, it works fine in Filtering via button click.
  But now, I also want to filter same HTML blocks, by using a <code>&lt;select&gt;&lt;/select&gt;</code>, dropdown.
  i.e OR condition is implemented in item selector. 
  N now additional code for <code>&lt;select&gt;</code> is :</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div id="filters" class="select-group"&gt;
  &lt;div class="col-sm-8"&gt;
    &lt;select class="form-control filter_by_type2 select" id="filter_2" placeholder=""&gt;
   &lt;option value="2" data-filter=".2"&gt;Two only&lt;/option&gt;
  &lt;/select&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$( document ).ready( function() {
    // init Isotope
    var $container = $('.isotope').isotope({
  itemSelector: '.class-1' || '.class-2',
  layoutMode: 'fitRows',
  getSortData: {
    name: '.name',
    symbol: '.symbol',
    number: '.number parseInt',
    category: '[data-category]',
    weight: function( itemElem ) {
      var weight = $( itemElem ).find('.weight').text();
      return parseFloat( weight.replace( /[\(\)]/g, '') );
    }
  }
    });
  
  
    // bind filter button click
    $('#filters').on( 'click', 'button', function() {
  var filterValue = $( this ).attr('data-filter');
  // use filterFn if matches value
  filterValue = filterFns[ filterValue ] || filterValue;
  $container.isotope({ filter: filterValue });
    });
  
    // bind select option value
    $('#filters').on( 'change', 'select', function() {
  var filterValue = $( this ).attr('data-filter');
  // use filterFn if matches value
  filterValue = filterFns[ filterValue ] || filterValue;
  $container.isotope({ filter: filterValue });
        });
  
    // change is-checked class on buttons
    $('.button-group').each( function( i, buttonGroup ) {
  var $buttonGroup = $( buttonGroup );
  $buttonGroup.on( 'click', 'button', function() {
    $buttonGroup.find('.is-checked').removeClass('is-checked');
    $( this ).addClass('is-checked');
     });
    });
  
  });
  </code></pre>