I have a checkboxlist with two items. I am having a hard time toggling between the two checkboxlist items using JavaScript. I would like to click on one and if the other is already checked, the check mark should go away. Following is the markup for the checkboxlist.

```
<asp:CheckBoxList ID="chkApplyLimits" runat="server" RepeatColumns="2" ClientIDMode="Static" onclick="CheckBoxToggle">
   <asp:ListItem Text="Yes" Value="1"></asp:ListItem>
   <asp:ListItem Text="No" Value="0"></asp:ListItem>
</asp:CheckBoxList>

```

I am using the following JavaScript function to enable the toggle. In the JavaScript, I am essentially getting all the child elements of the parent and then looping through them to set the checked property false for all of the child elements. Finally, I am making the checked property of the item clicked to true.

```
 function CheckBoxToggle(event) {
     if (event.srcElement.type == 'checkbox') {
         var childNodes = event.srcElement.parentNode.childNodes;
         for (var i = 0; i < childNodes.length; i++) {
             childNodes[i].setAttribute("checked", false);
         }
         event.srcElement.checked = true;
     }
 }

```

This works fine if nothing is checked at the beginning. However, when I click the second time both checkboxes become checked. Can someone please instruct how i can change this so that if one checkbox is already clicked, it will become unchecked when i click the second checkbox.

Any help is appreciated.