Div filtering using jquery -

hi i'd make div filter using multiple checkboxes, checkboxes have value div have classes. js comparing thoses value , classes , display similar ones. i'd combine checkboxes. example when glutenitoon , maidoton checked, element maidoton or glutenitoon should not shown.

here codepen http://codepen.io/anon/pen/yygpda

edit : solution here > http://codepen.io/anon/pen/kdagwm

<div id="filters">         <input type="checkbox" name="gluteeniton" value="gluteeniton" id="filter-gluteeniton">gluteeniton         <input type="checkbox" name="laktoositon" value="laktoositon" id="filter-laktoositon">laktoositon         <input type="checkbox" name="vahalaktoosinen" value="vahalaktoosinen" id="filter-vahalaktoosinen">vähälaktoosinen         <input type="checkbox" name="maidoton" value="maidoton" id="filter-maidoton">maidoton         <input type="checkbox" name="soijaton" value="soijaton" id="filter-soijaton">soijaton     </div>      <div class="filtered-products">                             <div class="element gluteeniton laktoositon maidoton">gluteeniton laktoositon maidoton</div>         <div class="element laktoositon maidoton">laktoositon maidoton</div>         <div class="element gluteeniton">gluteeniton</div>         <div class="element soijaton">soijaton</div>         <div class="element maidoton soijaton">maidoton soijaton</div>         <div class="element maidoton">maidoton</div>         <div class="element laktoositon">laktoositon</div>     </div>       $(".element").hide(); $("#filters input").click(function() {          var checked = $("#filters input ").is(':checked');         if (checked) {              $("#filters :checkbox:checked").each(function() {                 $("." + $(this).val()).show();             });         }         else {         $(".element").hide();         }        });    

if i've got question right, following should solution. please check chunk of codes once

$(".element").hide(); $("#filters input").click(function() {  var checked = $(this).is(':checked'); if (checked) {       $("#filters input[type='checkbox']:checked").each(function() {         $("." + $(this).val()).show();     }); } else {      $(".element."+$(this).val()).hide();     $("#filters input[type='checkbox']:checked").each(function() {         $("." + $(this).val()).show();     }); } });