Give element class when specific element has active class

305
December 10, 2016, at 3:13 PM

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">

Answer 1

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

if($('ul.prodtabmenu').find('li:nth-child(3)').hasClass('active'))
{
   $('.body').addClass('newClass');   
}
Answer 2

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

Rent Charter Buses Company
READ ALSO
JavaScript conflict with booking tool

JavaScript conflict with booking tool

I would like to insert a JavaScript booking tool on a website with WordPressSince the support of the booking tool couldn't help my, I'll try it this way

443
jQuery - One trigger per each certain scroll position

jQuery - One trigger per each certain scroll position

This is little hard to explainI have issue with infinite scroll function

354
Undefined ia not an object(evaluating RCTCameraRollManager.getPhotos)

Undefined ia not an object(evaluating RCTCameraRollManager.getPhotos)

I am using CameraRoll component to get photosBut i am getting undefined from CameraRoll

545
Map resize only works on events

Map resize only works on events

I am using jquery latitude longitude pluginMy map loads partially in jquery tabs hide and show

323