title: How do I use jQuery to add a class to a parent element when a child is clicked?
body: <p>I have menu structure like below:</p>
  
  <pre><code>&lt;ul class="sub-menu" style="display: none;"&gt;
  &lt;li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-1564 current_page_item menu-item-5230" id="menu-item-5230"&gt;&lt;a href="http://artofsujatha.wpstag.sirahu.net/curriculam-vitae/" title="Curriculam VItae"&gt;Curriculam VItae&lt;/a&gt;&lt;/li&gt;
  &lt;li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5231" id="menu-item-5231"&gt;&lt;a href="http://artofsujatha.wpstag.sirahu.net/bio/" title="Bio"&gt;Bio&lt;/a&gt;&lt;/li&gt;
  &lt;li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5232" id="menu-item-5232"&gt;&lt;a href="http://artofsujatha.wpstag.sirahu.net/artist-statement/" title="Artist Statement"&gt;Artist Statement&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>When I click any LI elements within the UL, I need to add class "active" to the UL element.
  How can I do this in jQuery?</p>