jQuery HTML Element How to - Get list item index

Question

We would like to know how to get list item index.

Answer


<!--  w  w  w.  ja  va2  s.  com-->
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<script>
  $(function() {
    var item2 = document.getElementById("item2");
    document.writeln($("li").index(item2));
  });
</script>
</head>
<body>
  <ul>
    <li id="item0">A</li>
    <li id="item1">B</li>
    <li id="item2">java 2s.com</li>
    <li id="item3">D</li>
    <li id="item4">E</li>
    <li id="item5">F</li>
  </ul>
</body>
</html>

The code above is rendered as follows: