Скрывает неправильный div, когда флажок не установлен в jQuery?

Я новичок в jquery и JS. Я работаю над проектом, в котором я хочу отображать и скрывать div на основе установленного флажка в виде изображения. но он не отображает соответствующий div. Пожалуйста, помогите мне улучшить мою логику.

<div class = "col-md-3"><label class = "btn btn-primary"><img class = "retina" src = "{{asset('app/img/logo.png')}}" alt = "..." class = "img-thumbnail img-check"><input type = "checkbox" name = "chk1" id = "hemming" value = "val1" class = "hidden" autocomplete = "off"></label></div>
  <div class = "col-md-3"><label class = "btn btn-primary"><img class = "retina" src = "{{asset('app/img/logo.png')}}" alt = "..." class = "img-thumbnail img-check"><input type = "checkbox" name = "chk2" id = "button" value = "val2" class = "hidden" autocomplete = "off"></label></div>
  <div class = "col-md-3"><label class = "btn btn-primary"><img class = "retina" src = "{{asset('app/img/logo.png')}}" alt = "..." class = "img-thumbnail img-check"><input type = "checkbox" name = "chk3" id = "patch" value = "val3" class = "hidden" autocomplete = "off"></label></div>
  <div class = "col-md-3"><label class = "btn btn-primary"><img class = "retina" src = "{{asset('app/img/logo.png')}}" alt = "..." class = "img-thumbnail img-check"><input type = "checkbox" name = "chk4" id = "zipper" value = "val4" class = "hidden" autocomplete = "off"></label></div>

Когда я нажимаю на любое из приведенных выше изображений, в соответствии с приведенным ниже div должен отображаться, как указано в js.

  <div class = "count" id = "hemmingcount" style = " display:none;">
        <div class = "col-md-3">
      <div class = "input-group number-spinner">
                <span class = "input-group-btn">
                    <button class = "btn btn-default" type = "button" data-dir = "dwn"><span class = "glyphicon glyphicon-minus"></span></button>
                </span>
                <input type = "text" class = "form-control text-center" value = "0" placeholder = "hemming">
                <span class = "input-group-btn">
                    <button class = "btn btn-default" type = "button" data-dir = "up"><span class = "glyphicon glyphicon-plus"></span></button>
                </span>
            </div>
        </div>
    </div>
  <div class = "count" id = "buttoncount" style = " display:none;">
  <div class = "col-md-3">
      <div class = "input-group number-spinner">
                <span class = "input-group-btn">
                    <button class = "btn btn-default" type = "button" data-dir = "dwn"><span class = "glyphicon glyphicon-minus"></span></button>
                </span>
                <input type = "text" class = "form-control text-center" value = "0" placeholder = "button">
                <span class = "input-group-btn">
                    <button class = "btn btn-default" type = "button"  data-dir = "up"><span class = "glyphicon glyphicon-plus"></span></button>
                </span>
            </div>
    </div>
  </div>
  <div class = "count" id = "patchcount" style = " display:none;">
<div class = "col-md-3">
      <div class = "input-group number-spinner">
                <span class = "input-group-btn">
                    <button class = "btn btn-default" type = "button" data-dir = "dwn"><span class = "glyphicon glyphicon-minus"></span></button>
                </span>
                <input type = "text" class = "form-control text-center" value = "0" placeholder = "patch">
                <span class = "input-group-btn">
                    <button class = "btn btn-default" type = "button" data-dir = "up"><span class = "glyphicon glyphicon-plus"></span></button>
                </span>
            </div>
    </div>
  </div>
  <div class = "count" id = "zippercount" style = " display:none;">
<div class = "col-md-3">
      <div class = "input-group number-spinner">
                <span class = "input-group-btn">
                    <button class = "btn btn-default" type = "button" data-dir = "dwn"><span class = "glyphicon glyphicon-minus"></span></button>
                </span>
                <input type = "text" class = "form-control text-center" value = "0" placeholder = "zipper">
                <span class = "input-group-btn">
                    <button class = "btn btn-default" type = "button" data-dir = "up"><span class = "glyphicon glyphicon-plus"></span></button>
                </span>
            </div>
    </div>
  </div>

Написанный мной сценарий

<script type = "text/javascript">
$(document).ready(function(e){
            $(".img-check").click(function(){
                $(this).toggleClass("check");
            });
    });


$(function () {
      $("#hemming").click(function () {
          if ($(this).is(":checked")) {
              $("#hemmingcount").show();
          }
           else {
              $("#hemmingcount").hide();
          }
      });
  });

  $(function () {
        $("#patch").click(function () {
            if ($(this).is(":checked")) {
                $("#patchcount").show();
            } else {
                $("#patchcount").hide();
            }
        });
    });

    $(function () {
          $("#button").click(function () {
              if ($(this).is(":checked")) {
                  $("#buttoncount").show();
              } else {
                  $("#buttoncount").hide();
              }
          });
      });

      $(function () {
            $("#zipper").click(function () {
                if ($(this).is(":checked")) {
                    $("#zippercount").show();
                } else {
                    $("#zippercount").hide();
                }
            });
        });
</script>

Заранее спасибо.