Div ID Same - Multiple Hide/Show - What Missing?
<p>PHP:</p>

<pre><code>&lt;input type='checkbox' onChange='DoTheSwitch(1);'&gt;&lt;div id='Hide1'&gt;Hide&lt;/div&gt; 1
&lt;input type='checkbox' onChange='DoTheSwitch(2);'&gt;&lt;div id='Hide2'&gt;Hide&lt;/div&gt; 2
&lt;input type='checkbox' onChange='DoTheSwitch(3);'&gt;&lt;div id='Hide3'&gt;Hide&lt;/div&gt; 3
&lt;input type='checkbox' onChange='DoTheSwitch(4);'&gt;&lt;div id='Hide4'&gt;Hide&lt;/div&gt; 4
&lt;input type='checkbox' onChange='DoTheSwitch(5);'&gt;&lt;div id='Hide5'&gt;Hide&lt;/div&gt; 5
</code></pre>

<p>JavaScript:</p>

<pre><code>function DoTheSwitch(a){
    var h = getEl("Hide"+a+"").innerHTML;
    switch(h){
        case "Hide":
            getEl("Hide"+a+"").innerHTML = "Show";
            $('input[id^="Hide"]').click(function(){
                $('#HideAB'+$(this).val()).hide();
            });
            break;
        case "Show":
            getEl("Hide"+a+"").innerHTML = "Hide";
            $('input[id^="Hide"]').click(function(){
                $('#HideAB'+$(this).val()).show();
            });
            break;
    }
}
</code></pre>

<p>Output (Many Small Dots on Map):</p>

<pre><code>&lt;div id='HideAB".$Stat."' style='display:block;'&gt;&lt;/div&gt;
</code></pre>

<p>Those "HideAB" will have a value of 1, 2, 3, 4, 5 or 6 based on what I pulled from Database.</p>

<p>What I'm trying to do (sleepyhead at the moment) is whenever a user select a check box "1", I want to hide all the HideAB with a value of 1, and uncheck to show, so forth.  How do I fix that in Javascript/JQuery part?</p>
