Toggle div visibility based on multiple checkboxes
<p>I have a multiple checkboxes. Checking any of them will make a div visible. Leaving them unchecked will hide the div. It almost works, thanks to Nick (http://stackoverflow.com/questions/4337378/toggle-div-based-on-checkbox-value) except that I want multiple checkboxes to toggle the div.</p>

<p>HTML:</p>

<pre><code>&lt;div id="somediv"&gt;
&lt;input type="checkbox" class="form-checkbox" value="a" name="a"&gt;
&lt;input type="checkbox" class="form-checkbox" value="b" name="b"&gt;
&lt;input type="checkbox" class="form-checkbox" value="c" name="c"&gt;
&lt;input type="checkbox" class="form-checkbox" value="d" name="d"&gt;
&lt;/div&gt;

&lt;div id="tog"&gt;tog content&lt;/div&gt;
</code></pre>

<p>jQuery:</p>

<pre><code>        var tog = $("#tog").hide();
        $('#somediv .form-checkbox').change(function() {              
          if ($(tog).css('display') == 'none') {
            tog.show();
          }       
        });
</code></pre>

<p>Another one:</p>

<pre><code>        var tog = $("#tog").hide();
        $('#somediv .form-checkbox').change(function () {                
            $(tog).toggle(this.checked);
        }).change();
</code></pre>

<p>What am I missing? 
The issue is when unchecking one of them (not all) hides the div. 
The requirement is only if none is checked, then hide. And hidden by default.
If any is checked, so keep it visible, no toggles.</p>

<p>Any hint would be very much appreciated.
Thanks</p>
