Question: **HTML**

```
<div>
   <a href=''> First </a>
</div>
<div>
   <div>
     <a href=''> Second </a>
   </div>
</div>
<a href=''>Third</a>

```

**Script**

```
$(document).ready(function(){
   $('a').click(function(){
     // find next a element
     //var next = $(this).next('a');
     //console.log(next.text());
   });
});

```

Fiddle: <https://jsfiddle.net/usyu30t6/>

I want that if i clicked on first `a` element, it gives me the text of next `a` element. And if i clicked on second `a` element, it gives me the next one and so on. Is it possible to do that?

Answer: 
You can also just store the click handlers in a variable and access them like this 

```
$(document).ready(function () {
    var allAs = $('a').click(function (e) { // <--- List of anchor tags
        e.preventDefault();
        var i = allAs.index(this) + 1; // <--- get next Index
        alert(allAs.eq(i).text()); // <--- get next anchor tag's text
    });
});

```

Full demo:

```js
$(document).ready(function() {
  var allAs = $('a').click(function(e) {
    e.preventDefault();
    var i = allAs.index(this) + 1;
    alert(allAs.eq(i).text());
  });
});
```

```html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <a href=''> First </a>
</div>
<div>
  <div>
    <a href=''> Second </a>
  </div>
</div>
<a href=''>Third</a>
```
```js
$('a').click(function(){
  var currentIndex = $('body a').index($(this))+1;
  var text = $('body a:eq('+currentIndex+')').text();
  console.log(text);
  });
```

```html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>
   <a href='javascript:void(0)'> First </a>
</div>
<div>
   <div>
     <a href='javascript:void(0)'> Second </a>
   </div>
</div>
<a href='javascript:void(0)'>Third</a>
```