Filtering click() if .attr ----

HTML

<input id="filter-categorya" class="js-toggler" type="checkbox" value="categorya"> <label for="filter-categorya">Category A
</label><br><input id="filter-categoryb" class="js-toggler" type="checkbox" value="categoryb"><label for="filter-categoryb">Category B
</label><br><input id="filter-categoryc" class="js-toggler" type="checkbox" value="categoryc"><label for="filter-categoryc">Category C
</label><br><input id="filter-categoryd" class="js-toggler" type="checkbox" value="categoryd"><label for="filter-categoryd">Category D
</label><br><input id="filter-categorye" class="js-toggler" type="checkbox" value="categorye"><label for="filter-categorye">Category E
</label><br><input id="filter-categoryf" class="js-toggler" type="checkbox" value="categoryf"><label for="filter-categoryf">Category F
</label><br><input id="filter-categoryg" class="js-toggler" type="checkbox" value="categoryg"><label for="filter-categoryg">Category G
</label><br><input id="filter-categoryh" class="js-toggler" type="checkbox" value="categoryh"><label for="filter-categoryh">Category H
</label><br><input id="filter-categoryi" class="js-toggler" type="checkbox" value="categoryi"><label for="filter-categoryi">Category I</label>
<div class="categorya">A</div>
<div class="categoryb">B</div>
<div class="categoryc">C</div>
<div class="categoryd">D</div>
<div class="categorye">E</div>
<div class="categoryf">F</div>
<div class="categoryg">G</div>
<div class="categoryh">H</div>
<div class="categoryi">I</div>
&nbsp;
<p class="info">- If you select 1-3 boxes = show first image. If you select 4-6 = second image. If you select 7-9 = third image. If you select all of them = fourth image.</p>
<br>

<h1>
Images:
</h1>

<div>
  <img alt="" class="js-toggle-image" data-show-for-checkboxes="[]" src="http://dummyimage.com/600x400/000/fff&amp;text=First+image">
  <img alt="" class="js-toggle-image" data-show-for-checkboxes="[1]" src="http://dummyimage.com/600x400/000/fff&amp;text=Second+image">
  <img alt=""...

CSS

.categorya, .categoryb, .categoryc, .categoryd, .categorye, .categoryf, .categoryg, .categoryh, .categoryi {
    display:none;
    font-size:13px;
    color:#000000;
    font-family:sans-serif;
}

p.info{
    padding:30px 20px 0 20px;
    color:#000;
    font-family:sans-serif;
    font-size:13px;
}

JavaScript

$('input').click(function() {
    var category = $(this).val();

    if (!$(this).attr('checked')) $('.' + category).hide();
    else $('.' + category).show();

});