I am trying to capture the event when a child element link is clicked and add class called "highlightchild" to it. Also I want to check if there are any child element link exist or not, if no child element exits ie "third level" highlight with "highlightparent" the parent. How can I do that using jquery?

$(document).ready(function() {
  $('.menu ul').hide();
  $('.menu .arrowUp').click(function() {
  $('.menu ul').hide();
  $(this).find(".third-level").toggle();
  });
});

html

<ul class="menu">
<li class="arrowUp"><a href="#">link1</a>
 <ul class="third-level" >             
 <!-- third level non-active -->
  <li class="arrowUp"><a href="/somelink/">Some Link</a></li>
 </ul>
</li>
<li class="arrowUp"><a href="#">link2</a>
 <ul class="third-level" >             
 <!-- third level non-active -->
  <li class="arrowUp"><a href="/links2/">some Links 2</a></li>
 </ul>
 </li>
<li class="arrowUp"><a href="#">link3</a>
 <ul class="third-level" >
 <!-- third level non-active -->
     <li class="arrowUp"><a href="/Agri/">Agricultural</a></li>
     <!-- third level non-active -->
      <li class="arrowUp"><a href="/sugar/">Sugar</a></li>
    <!-- third level non-active -->
      <li class="arrowUp"><a href="/bbc/">Coffee</a></li>
      <!-- third level non-active -->
      <li class="arrowUp"><a href="/cnn/">Energy</a></li>
      <!-- third level non-active -->
      <li class="arrowUp"><a href="funstuff">Fun stuff</a></li>
   </ul>
</li>
<li class="arrowUp"><a href="#">link4</a></li>
<li class="arrowUp"><a href="#">link5</a></li>
<li class="arrowUp"><a href="#">link6</a></li>
</ul>