JQuery finds validated input element inside container not working in ie9

Question

I created my own checkbox. Basically this is a set of 2 flags. When dom is ready, checkboxes are checked. The user is allowed to remove only one.

---

This is how I started to implement it.

I have such a container

<div class="container"> <input name="my_checkbox_1" type="checkbox" checked="checked"> <label for="my_checkbox_1" class="on">Hello</label> <input name="my_checkbox_2" type="checkbox" checked="checked"> <label for="my_checkbox_2" class="on">World</label> </div> 

now when the user clicks on the label, I find the nearest container

 parent = $(this).closest(".container"); 

as soon as I have a parent I find the number of flags that are so checked

 len = $(parent).find("input:checkbox:checked").length; 

if len is 0, I try to warn the user with the corresponding error. This works in all other browsers, but i.e. (Can it be said that there is no wonder?). but what am I doing wrong here?

Please keep in mind that I have several such containers with checkboxes with unique names.

I created a fiddle with code at http://jsfiddle.net/kiranruth/UeEyB/1/

Answer 1

You need to declare the parent as a local variable or rename it as you overwrite the parent property of the window

I would just add var in front of your variables

 var parent = $(this).closest(".container"); var len = $(parent).find("input:checkbox:checked").length;