Hello everyone...

I've got quite a challenging problem (for me) with jQuery and highlighting a parent <li> from activating checkboxes.

I've got a nested unordered list which contains checkboxes... Example HTML:

1. <ul>
2.         <li class="main_first"><span>Main Item 1</span>
3.                 <ul>
4.                         <li><input class="sub_first" type="checkbox"><label>Sub Item 1</label></li>
5.                         <li><input class="sub_second" type="checkbox"><label>Sub Item 2</label></li>
6.                 </ul>
   
7.         </li>
8. </ul>
   

Now, I need to have an additional class (something like "active") attached to the first main <li class="main_first"> only as long as any of the checkboxes is checked in the sub list, e. g. no checkbox checked means no additional class for the <li class="main_first">.

My jQuery-Code attached:

1.     $("fieldset.scoring ul ul input").click(function () {
2.         $(this).parents("li.scoring_cat").find("span").toggleClass("strong");
3.     });
   

Obviously that toggles the class, so when I check the second checkbox, the class that got added from the first activated checkbox gets deleted again.

If any of you kind souls outthere could help...

Thank you!
Chris