jQuery multiselect.js selects all options even they are not visible

  1. I use this plugin to make multiselect more comfortable – http://loudev.com/.
  2. I have also integrated search via quicksearch plugin.
  3. And I have set optgroup can be selected

But I would need, if any query is searched and optgroup is selected, to select only options which were found. If item is not match searched query, it is hidden via style="display: none", so I thought best practice to filter them out is to use :visible selector, but it does not work. I’ve also tried :not(:hidden), but it does not work either.

This is the code, which selects all options when optgroup is clicked.

$selectableOptgroup.find('.ms-optgroup-label').on('click', function(){
  var values = $optgroup.children(':not(:selected, :disabled)').map(function(){ return $(this).val();}).get();
  that.select(values);
});

And I’ve tried to edit this way, but still all options are selected.

$selectableOptgroup.find('.ms-optgroup-label').on('click', function(){
  var values = $optgroup.children(':not(:selected, :disabled, :hidden)').map(function(){ return $(this).val();}).get();
  that.select(values);
});