我有三类控件，每类都有几个选项：
<ul class="series-selector-items">
<li id="filter-type-A">A</li>
<li id="filter-type-B">B</li>
<li id="filter-type-C">C</li>
</ul>
<ul class="series-selector-items">
<li id="filter-type-E">E</li>
<li id="filter-type-F">F</li>
<li id="filter-type-G">G</li>
</ul>
<ul class="series-selector-items">
<li id="filter-type-H">H</li>
<li id="filter-type-I">I</li>
<li id="filter-type-J">J</li>
<li id="filter-type-K">K</li>
</ul>
然后我有一个列表，其中包含来自上述控件的属性组合的项目：
<ul>
<li class="A E H">Item AEH</li>
<li class="A F I">Item AFI</li>
<li class="A G J">Item AGJ</li>
<li class="A G H">Item AGH</li>
<li class="B E H">Item BEH</li>
<li class="B F H">Item BFH</li>
<li class="B F H">Item BFH</li>
<li class="C E I">Item CEI</li>
<li class="C G K">Item CEI</li>
etc etc...
</ul>
我正在尝试找到一种基于所选控制选项组合过滤结果的方法。我需要能够选择控制选项的任意组合（例如 AEH）并显示所有具有正确属性的项目（项目 AEH）。
每个类别 (ABEK) 中应该有多个选项可供选择，并且类别应该协同工作以显示具有正确元素组合的选项。如果从同一类别中选择了多个选项，它们的结果仍应显示。我已将控制列表设为 li，但它们也可以是复选框。
使用 jQuery 执行此操作的最佳方法是什么？
编辑：这是我迄今为止尝试过的一种方法，将选定的选项添加到数组中：
var seriesSelected = [];
$('ul.series-selector-items').click(function(){
//Select the series clicked and give it the "selected" class
$(this).toggleClass("selected");
//Once selected, add the series to the seriesSelected array
if ($(this).hasClass('selected')) {
seriesSelected.push($(this).attr('id'));
}
//If de-selecting (by toggling off the "selected class"), then remove from the seriesSelected array
else {
seriesToRemove = $(this).attr('id');
seriesSelected = $.grep(seriesSelected, function(value) {
return seriesToRemove != value;
});
}
});
不知道从那里去哪里...