How to hide other input when one is checked?
<p><strong>HTML</strong></p>

<pre><code>&lt;div&gt;
    Group 1&lt;br&gt;
    &lt;input type="checkbox" name="testing" value="B"&gt;A&lt;br&gt;
    &lt;input type="checkbox" name="testing" value="I"&gt;B&lt;br&gt;
    &lt;input type="checkbox" name="testing" value="A"&gt;C&lt;br&gt;
&lt;/div&gt;
&lt;div&gt;
    Group 2&lt;br&gt;
    &lt;input type="checkbox" name="testing2" value="B"&gt;A&lt;br&gt;
    &lt;input type="checkbox" name="testing2" value="I"&gt;B&lt;br&gt;
    &lt;input type="checkbox" name="testing2" value="A"&gt;C&lt;br&gt;
&lt;/div&gt;
</code></pre>

<p><strong>JS</strong></p>

<pre><code>$("input:checkbox").change(function() {
    if (this.checked) {
        var checkname = $(this).attr("name");
        $("input:checkbox[name='" + checkname + "']").removeAttr("checked");
        this.checked = true;
    }
});
</code></pre>

<p>This script make in sort that checkbox act like radio so only 1 can be checked for the same name attribute. Now I want it to hide those who are unchecked with the same name attribute. And if I uncheck the checked one, all other checkbox comes back.</p>

<p>A fiddle you say ? : <a href="http://jsfiddle.net/warface/gcX7Y/" rel="nofollow">http://jsfiddle.net/warface/gcX7Y/</a></p>
