Rocky
Rocky

Reputation: 73

jquery - add "active" class to children elements

Need to add an active class to my parent element if a user clicks on the child element in a list. The below script is used if a user clicks on the parent link.

Javascript:

<script language="javascript" type="text/javascript"> 
$(document).ready(function(){ 
var str=location.href.toLowerCase(); 
$('.body-content-container-pascrc ul#pascrc-sitenav li a').each(function() { 
if (str.indexOf(this.href.toLowerCase()) > -1) { 
$(this).attr("class","active"); //hightlight parent tab 
} 
}); 
}); 
</script>

HTML:

<ul id="navigation">
  <li> <a href="#" id="agenda-link">Agenda</a>
    <ul id="agenda" class="megamenu">
      <li><a href="#">June 8, 2011</a>
      </li>
      <li><a href="#">June 9, 2011</a>
      </li>
      <li><a href="#">June 10, 2011</a>
      </li>
    </ul>
  </li>
</ul>

Can someone please assist?

Upvotes: 1

Views: 2562

Answers (1)

switz
switz

Reputation: 25188

$(".body-content-container-pascrc ul#pascrc-sitenav li a").click(function() {
   $(this).parent().addClass("active");
});

jsfiddle: http://jsfiddle.net/switz/csgej/

Upvotes: 1

Related Questions