Question

I have a set of random/dynamic generated div checkboxes:

<div>A1 <input type='checkbox' name='A[]' value='A1'> </div>
<div>A2 <input type='checkbox' name='A[]' value='A2'> </div>
<div>A3 <input type='checkbox' name='A[]' value='A3'> </div>
<div>B1 <input type='checkbox' name='B[]' value='B1'> </div>
<div>B2 <input type='checkbox' name='B[]' value='B2'> </div>
<div>C1 <input type='checkbox' name='C[]' value='C1'> </div>

What I am trying to do is when the user:

1. checks any A then the others will hide (entire div) but all A will still show.
2. unchecks a checkbox, then all A, B, C will show again.

This is because I am preventing the user from checking a mix of options.

PS:
You can provide a solution that might need me to modify the generated output of checkboxes.

Answer 1

Thanks guys, especially dbaseman (get me ideal) :
ok, Here is my code after referring from you all.

$("input[type=checkbox]").on("click", function() {
    var sta = $(this).is(":checked"); sta=(sta==true?1:0);
    if(sta==1){
        var thisName = $(this).prop("name"); thisName=thisName.replace("[]","");
        $("div input[type=checkbox]:not([name^=" + thisName + "])").parent().hide();
    }else{
        var num = $("[type=checkbox]:checked").length;
    if(num==0){
            $("div input[type=checkbox]").parent().show();
    }
    }
});

so far code able is performing as what i need.
Ps: i am still weak on jquery travelling part

Ps: Edited on re-opening all checkboxes part
Thanks once again!