Получение значения из нескольких выпадающих списков и поиска для фильтрации содержимого списка

Question

У меня есть два раскрывающихся списка, которые я хочу использовать для фильтрации значений списка, и я также хочу использовать поисковый фильтр в нем как необязательный. Все, что я хочу, это чтобы эти 2 выпадающих списка работали вместе для фильтрации содержимого списка с помощью дополнительной панели поиска.

Демонстрационная версия pi c приведена ниже.

$("select.filterby").change(function() {
  var filters = $.map($("select.filterby").toArray(), function(e) {
    return $(e).val();
  }).join(".");
  
  $("div#FilterContainer").find("div").hide();
  $("div#FilterContainer").find("div." + filters).show();
});

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<p>Faculty: </p>
<select class="filterby">
  <option value="all">
    <h5>Show All</h5>
  </option>
  <option value="1">
    <h5>Faculty</h5>
  </option>
  <option value="2">
    <h5>Admin</h5>
  </option>
  <option value="3">
    <h5>Academic</h5>
  </option>
  <option value="3">
    <h5>Staff</h5>
  </option>
</select>

<p>Department: </p>
<select class="filterby">
  <option value="all">
    <h5>All Locations</h5>
  </option>
  <option value="nj">
    <h5>NJ</h5>
  </option>
  <option value="ny">
    <h5>NY</h5>
  </option>
  <option value="pa">
    <h5>PA</h5>
  </option>
</select>

<div id="FilterContainer">
  <div class="all 1 nj">Test One NJ</div>
  <div class="all 1 ny">Test One NY</div>
  <div class="all 1 pa">Test One PA</div>
  <div class="all 2 nj">Test Two NJ</div>
  <div class="all 2 ny">Test Two NY</div>
  <div class="all 2 pa">Test Two PA</div>
  <div class="all 3 nj">Test Three NJ</div>
  <div class="all 3 ny">Test Three NY</div>
  <div class="all 3 pa">Test Three PA</div>
  <div class="all 1 nj">Test One NJ</div>
  <div class="all 1 pa">Test One PA</div>
  <div class="all 1 pa">Test One PA</div>
  <div class="all 2 nj">Test Two NJ</div>
  <div class="all 2 ny">Test Two NY</div>
  <div class="all 2 ny">Test Two NY</div>