js實現用li進行篩選

<ul id="filter-school" class="am-avg-sm-2 filter-box">
            <li>中國海洋大學</li>
            <li>中國海洋大學</li>
            <li>青島大學</li>
            <li>青島科技大學</li>
            <li>中國石油大學</li>
            <li>山東大學</li>
          </ul>
          <ul id="filter-direction" class="am-avg-sm-2 filter-box">
            <li>的</li>
            <li>中國海洋大學</li>
            <li>青島大學</li>
            <li>青島科技大學</li>
            <li>中國石油大學</li>
            <li>山東大學</li>
          </ul>
          <button onclick="filterbtn()">123</button>

<script>
  function clearselesch(){
    $("#filter-school > li").each(function(){
      $(this).removeClass("selected")
    })
  }
  function clearseledir(){
    $("#filter-direction > li").each(function(){
      $(this).removeClass("selected")
    })
  }
  window.onload = function(){
    var lis1 = document.getElementById('filter-school').getElementsByTagName("li");
    for (var i = 0; i < lis1.length; i++) {
      lis1[i].a = i;
      lis1[i].onclick = function(){
        schoolvalue = this.a;
        console.log(schoolvalue)
      }
    };
    var lis2 = document.getElementById('filter-direction').getElementsByTagName("li");
    for (var i = 0; i < lis2.length; i++) {
      lis2[i].a = i;
      lis2[i].onclick = function(){
        directionvalue = this.a;
        console.log(directionvalue)
      }
    };
  }
  $("#filter-school > li").click(function(){
    clearselesch();
    $(this).addClass("selected");
  })
  $("#filter-direction > li").click(function(){
    clearseledir();
    $(this).addClass("selected");
  })
  function filterbtn(){
      url = schoolvalue + "/" + directionvalue;
      console.log(url)
  }
</script>