jquery - Compare index value and add class to the container -

created carousel slider. cant able figure logic compare "slidesjs-index" & "data-item". if both value same, add class "active" "carousel-thumb--content".

can 1 pls me solve issue?

carousel slider:

<div class="slides-item slidesjs-slide" slidesjs-index="0">  <a href="#">     <img src="http://placehold.it/1120x632"  />  </a> </div>  <div class="slides-item slidesjs-slide" slidesjs-index="1">   <a href="#">     <img src="http://placehold.it/1120x632"  /> </a> </div> 

carousel div container pagination:

<div class="carousel-thumb">   <div class="carousel-thumb--content">     <a href="#" class="custom-item" data-item="0">         <div class="carousel-thumb--text">             <div class="carousel-thumb--title">lorem ipsum dolor 1</div>             <div class="carousel-thumb--desc">ut fringilla augue eget quam lacinia</div>         </div>     </a>   </div>   <div class="carousel-thumb--content">     <a href="#" class="custom-item" data-item="1">         <div class="carousel-thumb--text">             <div class="carousel-thumb--title">lorem ipsum dolor 1</div>             <div class="carousel-thumb--desc">ut fringilla augue eget quam lacinia</div>         </div>     </a>   </div> </div> 

script used click function works fine. using slide js plugin carousel.

$('.custom-item').click(function(e){    e.preventdefault();    $('.carousel-thumb--content').removeclass('active');    $(this).parent().addclass('active');    $('a[data-slidesjs-item=\'' + $(this).attr('data-item') + '\']').trigger('click'); }); 

the first , foremost thumb rule please, don't invent new attributes, instead use data-* attributes html 5. change code to:

<div class="slides-item slidesjs-slide" data-index="0">   <a href="#">     <img src="http://placehold.it/1120x632" />   </a> </div>  <div class="slides-item slidesjs-slide" data-index="1">   <a href="#">     <img src="http://placehold.it/1120x632" />   </a> </div> 

and use .data() method , .closest() calculate , update want:

$('.custom-item').click(function(e){    e.preventdefault();    $('.carousel-thumb--content').removeclass('active');    $(this).parent().addclass('active');    $(this).closest('a[data-index=\'' + $(this).attr('data-item') + '\']').trigger('click'); }); 

note: may need tweak code lil bit make work you!