如何使用javascript onclick菜单隐藏/显示列表项。

Question

我正在使用Mapbox并且有一个菜单可以打开和关闭标记以及由javascript生成并填充标记标题的列表。我需要的是在切换不同类别时更改列表项，而不是显示整个列表。是否可以使用if，else语句执行此操作？

这是实时地图的链接：Visual Map for Visual Art

这里是脚本（我遗漏了一些冗余的菜单onclick代码，我还没弄清楚如何组合所以我不必为每个菜单项重复一次）：

<script>
L.mapbox.accessToken = 'pk.eyJ1IjoiZGUtZmluZS1hcnQiLCJhIjoidFJyclFabyJ9.sBXgFmwT-4dhGAevwEmKuA';
    var map = L.mapbox.map('map', 'de-fine-art.lh9dpd0k'),
        markerList = document.getElementById('marker-list');
        sxsw = document.getElementById('filter-sxsw'),
        performance = document.getElementById('filter-performance'),
        miscellaneous = document.getElementById('filter-miscellaneous'),
        party = document.getElementById('filter-party'),
        streetart = document.getElementById('filter-streetart'),
        gallery = document.getElementById('filter-gallery'),
        museum = document.getElementById('filter-museum'),
        all = document.getElementById('filter-all');
        
      

  map.featureLayer.on('ready', function(e) {
      map.featureLayer.eachLayer(function(layer) {
          var item = markerList.appendChild(document.createElement('li'));
          item.innerHTML = layer.toGeoJSON().properties.title;
          item.style.background = layer.toGeoJSON().properties['marker-color'];
          item.onclick = function() {
             map.setView(layer.getLatLng(), 16);
             layer.openPopup();
          };
      });
  });
      museum.onclick = function(e) {
        all.className = '';
        gallery.className = '';
        streetart.className = '';
        party.className = '';
        miscellaneous.className = '';
        performance.className = '';
        sxsw.className = '';
        this.className = 'active';
        // The setFilter function takes a GeoJSON feature object
        // and returns true to show it or false to hide it.
        map.featureLayer.setFilter(function(f) {
            return f.properties['marker-symbol'] === 'museum';
        });
        return false;
    };

    all.onclick = function() {
        museum.className = '';
        gallery.className = '';
        streetart.className = '';
        party.className = '';
        miscellaneous.className = '';
        performance.className = '';
        sxsw.className = '';
        this.className = 'active';
        map.featureLayer.setFilter(function(f) {
            // Returning true for all markers shows everything.
            return true;
        });
        return false;
    };
    


</script>`