Javascript - Get li number from list
http://stackoverflow.com/a/24477310/2507142
by katalin_2003
HTML
<ul id="group">
<li>1st</li>
<li>2nd</li>
<li>3rd</li>
<li>4th</li>
<li>5th</li>
</ul>
CSS
li {
list-style-type: none;
border: 2px solid #000;
height: 1.5em;
width: 100%;
margin: 0;
padding: 0;
}
.clicked {
background-color: #f00;
}
JavaScript
function getIndexFrom(event){
var clicked = event.target,
children = clicked.parentNode.children;
for (var i = 0, len = children.length; i < len; i++){
if (children[i] === clicked){
console.log('div clicked: ' + (i + 1)); // adding 1 since index starts at 0
return i;
}
}
return false;
}
document.getElementById('group').addEventListener('click', getIndexFrom);
// jQuery
// $('#group').on('click', getIndexFrom);