Getting index of clicked list element

Question

How can I get the index of the clicked element in a list?

So if I have the following list:

First
Second
Third

When I click Third, I would like to get the index 2, provided the index starts with 0.

With my code I only get 0s:

HTML:

<ul>
  <li><a href="#" class="listElem">First</a></li>
  <li><a href="#" class="listElem">Second</a></li>
  <li><a href="#" class="listElem">Third</a></li>
</ul>

JS:

$(".listElem").click(function(param) {
  console.log($(this).index());
});

Here is a fiddle.

Possible duplicate of How to get index of <li> element

Cruiser
– Cruiser

2016-07-28 13:22:24 +00:00
Commented Jul 28, 2016 at 13:22 — Cruiser
– Cruiser, Commented Jul 28, 2016 at 13:22

Nenad Vracar · Accepted Answer · 2016-07-28 13:23:10Z

3

You should use parent() to return index of li DEMO

$(".listElem").click(function(param) {
  console.log($(this).parent().index());
});

answered Jul 28, 2016 at 13:23

Nenad Vracar

122k16 gold badges160 silver badges184 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

n-dru · Accepted Answer · 2016-07-28 13:27:22Z

0

Use this:

$(".listElem").click(function(param) {
  console.log($(".listElem").index(this));
});

DEMO

answered Jul 28, 2016 at 13:27

n-dru

9,4402 gold badges31 silver badges43 bronze badges

Comments

Manikandan · Accepted Answer · 2016-07-28 13:35:25Z

0

Try this

$("li").click(function() {
  var index = $(this).parent().children().index(this);
  alert("You clicked item " + index);
});

answered Jul 28, 2016 at 13:35

Manikandan

1,23212 silver badges18 bronze badges

Collectives™ on Stack Overflow

Getting index of clicked list element

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related