3

Is it possible with Jquery to add another class to the .body element when the third li element has an .active class? It cant just add an class based on the .active class, it has to be the .active on the third li element specifically. 

<div id="extendedinfobox">
   <ul class="prodtabmenu">
    <li></li>
    <li></li>
    <li class="active"></li>
    <li></li>
    <li></li>
  </ul>
 </div>
<div class="body">

Jerry
  • 1,069
  • 2
  • 13
  • 31

2 Answers2

4

https://jsfiddle.net/sn2nc9bd/1/

if($('ul.prodtabmenu').find('li:nth-child(3)').hasClass('active'))
{
   $('.body').addClass('newClass');   
}
z1m.in
  • 1,661
  • 13
  • 19
  • you might need a jsfiddle edit, it doesn't look right. EDIT nvm i see you were just following his directions adding a class to the body – jShoop Nov 13 '15 at 10:15
  • I already edited my comment, but I thought it was wrong because I misunderstood he wanted to add a class to the *body* as a result of the selection. your class to add to the body had a height of 10px, so it looked like a misplaced line highlight. my mistake. – jShoop Nov 13 '15 at 10:20
1

if ($('ul.prodtabmenu').find('li:nth-child(3)').hasClass('active')) {
  //$('body').addClass('disabled');
  $('.body').addClass('disabled');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div id="extendedinfobox">
  <ul class="prodtabmenu">
    <li>2</li>
    <li>21</li>
    <li class="active">3</li>
    <li>4</li>
    <li>1</li>
  </ul>
</div>
<div class="body">

Try like this

Use .nth-child()

Description: Selects all elements that are the nth-child of their parent.

use .nth-child(3) to select the 3rd li

guradio
  • 15,524
  • 4
  • 36
  • 57