title: List.js dropdown select- is fuzzy search possible?
body: <p>I'm trying to use List.js's fuzzy search with a dropdown selector. The reason is I have a project to make an event itinerary searchable by presenter. The problem is, there are multiple presenters for each session, and the number varies with each session. There is also some  overlap, as you'll see in my code. I want the dropdown to filter the list to show all sessions starring a particular presenter. Since it seems list.js search out of the box will only find the match of a single value per list item, I can't just create a list item called "presenter" for instance, as there will be more than one per session.</p>
  
  <p>I thought just listing the presenters in a catch-all details class, then using fuzzy search to find the names would do. But I can't get it to work. I don't know if it's something fuzzy search can't do to dropdowns, if the parameters are incorrect, or if it's just a simple goof. I have made a jsfiddle for this <a href="http://jsfiddle.net/michaelsalmons/y4b26gcb" rel="nofollow">here</a>, and below is my code. Any help would be appreciated!</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var userList = new List('users', options);
  
  var options = {
    valueNames: ['date', 'timestamp', 'venue', 'details'],
    plugins: [
      ListFuzzySearch()
    ]
  };
  
  var fuzzyOptions = {
    searchClass: "fuzzy-search",
    location: 5,
    distance: 400,
    threshold: 0.4,
      multiSearch: true
  };
  
  document.getElementById('filterByTeller').addEventListener('change', function() {
    var selectedTeller = this.options[this.selectedIndex].value;
    if (selectedTeller == "") {
      userList.filter();
      return;
    }
    userList.filter(function(item) {
      return item.values().details == selectedTeller;
    });
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>h2 {
    font-family:sans-serif;
  }
  .list {
    font-family:sans-serif;
    margin:0;
    padding:20px 0 0;
  }
  .list &gt; li {
    display:block;
    background-color: #eee;
    padding:10px;
    box-shadow: inset 0 1px 0 #fff;
  }
  .avatar {
    max-width: 150px;
  }
  img {
    max-width: 100%;
  }
  h3 {
    font-size: 16px;
    margin:0 0 0.3rem;
    font-weight: normal;
    font-weight:bold;
  }
  p {
    margin:0;
  }
  
  input {
    border:solid 1px #ccc;
    border-radius: 5px;
    padding:7px 14px;
    margin-bottom:10px
  }
  input:focus {
    outline:none;
    border-color:#aaa;
  }
  .sort {
    padding:8px 30px;
    border-radius: 6px;
    border:none;
    display:inline-block;
    color:#fff;
    text-decoration: none;
    background-color: #28a8e0;
    height:30px;
  }
  .sort:hover {
    text-decoration: none;
    background-color:#1b8aba;
  }
  .sort:focus {
    outline:none;
  }
  .sort:after {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid transparent;
    content:"";
    position: relative;
    top:-10px;
    right:-5px;
  }
  .sort.asc:after {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #fff;
    content:"";
    position: relative;
    top:13px;
    right:-5px;
  }
  .sort.desc:after {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #fff;
    content:"";
    position: relative;
    top:-10px;
    right:-5px;
  }
  
  .hide {
  visibility: hidden;}</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://listjs.com/no-cdn/list.js"&gt;&lt;/script&gt;
  &lt;script src="http://listjs.com/no-cdn/list.fuzzysearch.js"&gt;&lt;/script&gt;
  &lt;div id="users"&gt;
    &lt;input class="fuzzy-search" placeholder="Search" /&gt;
    
    &lt;select id="filterByTeller" class="fuzzy-search"&gt;
    &lt;option value=""&gt;All&lt;/option&gt;
    &lt;option value="Karen Ogden"&gt;Karen Ogden&lt;/option&gt;
    &lt;option value="Faith Buckland"&gt;Faith Buckland&lt;/option&gt;
    &lt;option value="Carl King"&gt;Carl King&lt;/option&gt;
    &lt;option value="Joseph Taylor"&gt;Joseph Taylor&lt;/option&gt;
    &lt;option value="Felicity North"&gt;Felicity North&lt;/option&gt;
   &lt;option value="Charlotte Blake"&gt;Charlotte Blake Alston&lt;/option&gt;
   &lt;/select&gt;
  &lt;ul class="list"&gt;
  &lt;li&gt;
  &lt;p class="date"&gt; &lt;span class="timestamp hide"&gt;1462442400&lt;/span&gt;&lt;strong&gt;Wed., May 5, 2016&lt;/strong&gt;&lt;/p&gt;
  &lt;p class="venue"&gt;&lt;strong&gt;County Public Library&lt;/p&gt;
  &lt;p class="details"&gt;In this special evening, the stages are a platform for festival tellers and open-mic tellers alike to share true, personal tales on what home means to them.&lt;br /&gt;
  10 a.m. Ages: Pre-K&lt;br /&gt;
  Tellers: Karen Ogden, Faith Buckland&lt;/p&gt;
  &lt;/li&gt;
  
  &lt;li&gt;
  &lt;p class="date"&gt; &lt;span class="timestamp hide"&gt;1462442400&lt;/span&gt;&lt;strong&gt;Wed., May 5, 2016&lt;/strong&gt;&lt;/p&gt;
  &lt;p class="venue"&gt;&lt;strong&gt;Kirkland Center&lt;/p&gt;
  &lt;p class="details"&gt;Listen to local high school tellers share spooky tales they have crafted in pre-festival workshops.&lt;br /&gt;
  7 p.m. Ages: All&lt;br /&gt;
  Tellers: Carl King, Joseph Taylor, Felicity North&lt;/p&gt;
  &lt;/li&gt;
  
  &lt;li&gt;
  &lt;p class="date"&gt; &lt;span class="timestamp hide"&gt;1462442400&lt;/span&gt;&lt;strong&gt;Wed., May 5, 2016&lt;/strong&gt;&lt;/p&gt;
  &lt;p class="venue"&gt;&lt;strong&gt;Miller Amphitheater&lt;/p&gt;
  &lt;p class="details"&gt;Grande Finale event.
  Kirkland Center, 7 p.m. Ages: All
  Tellers: Karen Ogden, Faith Buckland, Carl King, Joseph Taylor, Felicity North&lt;/p&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>