Apply filters to list

This fiddle shows how to apply a multple-filter solution based on checkbox selection

by pradeep

HTML

<div class="itemswrap">
	<div class="inditem dynamic1 dynamic12">inditem dynamic1 dynamic12</div>
	<div class="inditem dynamic2 dynamic22">inditem dynamic2 dynamic22</div>
	<div class="inditem dynamic3 dynamic32">inditem dynamic3 dynamic32</div>
	<div class="inditem dynamic2 dynamic42">inditem dynamic2 dynamic42</div>
</div>
<ul class="subnav">
	<li class="lifilter">
		<input type="checkbox" class="filtercheck" id="dynamic1" />
		<label for="dynamic1">dynamic1</label>
	</li>
	<li class="lifilter">
		<input type="checkbox" class="filtercheck" id="dynamic2" />
		<label for="dynamic1">dynamic2</label>
	</li>
	<li class="lifilter">
		<input type="checkbox" class="filtercheck" id="dynamic3" />
		<label for="dynamic1">dynamic3</label>
	</li>
</ul>
<ul class="subnav2">
	<li class="lifilter2">
		<input type="checkbox" class="filtercheck2" id="dynamic12" />
		<label for="dynamic12">dynamic12</label>
	</li>
	<li class="lifilter2">
		<input type="checkbox" class="filtercheck2" id="dynamic22" />
		<label for="dynamic12">dynamic22</label>
	</li>
	<li class="lifilter2">
		<input type="checkbox" class="filtercheck2" id="dynamic32" />
		<label for="dynamic12">dynamic32</label>
	</li>
</ul>

JavaScript

$("input[type='checkbox']").change(function()
{
    var list = "";
    
    $("input[type='checkbox']").each(function()
    {
        if(this.checked)
		{
			list = list + '.' + $(this).attr('id');
		}
    });

	if(list !=='')
	{
		$("div.inditem").hide();
		$(list).show();
	}
	else {
		$("div.inditem").show();
	}
});