Uncheck parent node if all children unchecked in JQuery
<p>I want to uncheck parent node if all children are unchecked.</p>

<pre><code>&lt;ul id="treeList"&gt;
   &lt;li&gt;
   &lt;input type="checkbox" name="selectedRole"&gt;
   Application Manager
    &lt;ul&gt;
       &lt;li&gt;
           &lt;input type="checkbox" name="selectedRole"&gt;
           Application Manager Panel
       &lt;/li&gt;
       &lt;li&gt;
            &lt;input type="checkbox" name="selectedRole"&gt;
            Client Role
             &lt;ul&gt;
               &lt;li&gt;
                   &lt;input type="checkbox" name="selectedRole"&gt;
                   Client Task 1
                &lt;/li&gt;
                &lt;li&gt;
                   &lt;input type="checkbox" name="selectedRole"&gt;
                    Client Task 2
                &lt;/li&gt;
                 &lt;/ul&gt;
              &lt;/li&gt;
           &lt;/ul&gt;
       &lt;/li&gt;
</code></pre>

<p></p>

<p>I have following jQuery script. But when I uncheck any children, the parent got uncheck. It should see, if all children are unchecked. then it should uncheck the parent. </p>

<pre><code>jQuery.each(jQuery('#treeList ul li').find(':checkbox'),  function(){
    jQuery(this).change(function (){
        if (jQuery(this).is(':checked')) {
            jQuery(this).parents('ul').siblings('input:checkbox').attr('checked', true);
        }else{
            jQuery(this).parents('ul').siblings('input:checkbox').attr('checked', false);
        }        
    });    
});
</code></pre>
