How can I use the value of a checkbox to hide the div with the corresponding ID?

I'm using a set of checkboxes with each corresponding to a div containing content. I'm trying to only use a single function for all the checkboxes.

I've created a function which looks for any checkbox being clicked, identifies if the checkbox is checked and then attempts to show the corresponding content.

<script type="text/javascript">
    $(document).ready(function(){
        $('input[type="checkbox"]').click(function(){
            if($(this).prop("checked") == true){
                $(this).show();
            }
            else if($(this).prop("checked") == false){
                $(this).hide();

            }
        });
    });
</script>

<input type="checkbox" name="dieConstant" value="'#dc'"> Show Dielectric Constant<br>


<div id="dc" style="display:none">
    content
</div>

When the checkbox is ticked, the content in the "dc" div should appear, but it does not. Note that replacing " $(this).show(); " with " $(#dc).show(); " gives the intended result and that is what I need, but it needs to work will all checkboxes.