How to get index of css element inside 'click' event?

I have a group of images with a class thumb

. In an event, click

I want to know which image the user has clicked from the array thumbs

. Basically, I want the index of (this) image in the array thumbs

.

Html

<img class="thumb" src="#" />
<img class="thumb" src="#" />
<img class="thumb" src="#" />
<img class="thumb" src="#" />

      

Javascript

var thumbs = $('.thumb'); 
$('.thumb').click(function(){

      current_thumb = ??;
});

      

+3


source to share


1 answer


Use jQuery index



var thumbs = $('.thumb'); 
$('.thumb').click(function(){
 var current_thumb = thumbs.index(this);
 alert(current_thumb);
});
      

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img class="thumb" src="#" />
<img class="thumb" src="#" />
<img class="thumb" src="#" />
<img class="thumb" src="#" />
      

Run code


+3


source







All Articles