title: Jquery Check parent checkboxes in nested ul li
body: <p>I have a script that will check and uncheck all children checkboxes in a nested list. I am now trying to get it so I can check a low level checkbox and it will check all the parents only back up to the highest level. <a href="http://jsfiddle.net/3y3Pb/" rel="noreferrer">Here is a JSFiddle</a></p>
  
  <pre><code>&lt;ul class="tree" id="tree"&gt;
  
      &lt;li&gt;&lt;input type="checkbox" name="account_settings" value="yes"&gt;Account Settings &lt;!-- AND SHOULD CHECK HERE --&gt;
          &lt;ul&gt;
              &lt;li&gt;&lt;input type="checkbox" name="one" value="one"&gt;AS One&lt;/li&gt;
              &lt;li&gt;&lt;input type="checkbox" name="two" value="two"&gt;AS Two&lt;/li&gt;
              &lt;li&gt;&lt;input type="checkbox" name="user_roles" value="user_roles"&gt;Users &amp;amp; Roles &lt;!-- SHOULD CHECK HERE --&gt;
                  &lt;ul&gt;
                      &lt;li&gt;&lt;input type="checkbox" name="user_role" value="add"&gt;Add&lt;/li&gt;
                      &lt;li&gt;&lt;input type="checkbox" name="user_role" value="delete"&gt;Delete&lt;/li&gt; &lt;!-- CHECK HERE --&gt;
                  &lt;/ul&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
  
      &lt;li&gt;&lt;input type="checkbox" name="rl_module" value="yes"&gt;RL Module&lt;/li&gt;
  
      &lt;li&gt;&lt;input type="checkbox" name="rl_module" value="yes"&gt;Accounting
          &lt;ul&gt;
              &lt;li&gt;&lt;input type="checkbox" name="vat" value="yes"&gt;VAT&lt;/li&gt;
              &lt;li&gt;&lt;input type="checkbox" name="bank_account" value="yes"&gt;Banking
                  &lt;ul&gt;
                      &lt;li&gt;&lt;input type="checkbox" name="view" value="yes"&gt;View&lt;/li&gt;
                      &lt;li&gt;&lt;input type="checkbox" name="crud" value="yes"&gt;CRUD&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
  
  &lt;/ul&gt;
  </code></pre>
  
  <p>And the corresponding javascript:</p>
  
  <pre><code>$('input[type=checkbox]').click(function(){
  
      // if is checked
      if($(this).is(':checked')){
  
          // check all children
          $(this).parent().find('li input[type=checkbox]').prop('checked', true);
  
          // check all parents
          $(this).parent().prev().prop('checked', true);
  
      } else {
  
          // uncheck all children
          $(this).parent().find('li input[type=checkbox]').prop('checked', false);
  
      }
  
  });
  </code></pre>