<ul id="dfruits">
<li>Apple</li>
<li>Dragonfruit</li>
<li>Damson</li>
<li>Cloudberry</li>
<li>Blueberry</li>
<li>Cherry</li>
<li>Blackcurrant</li>
<li>Coconut</li>
<li>Avocado</li>
<li>Pinaple</li>
</ul>
$(document).ready(function() {
var
SomeFruitsList=$("ul#dfruits li"),
//set tab index to starts from 1
tabindex = 0;
SomeFruitsList.each(function() {
// add tab index number to each list items
tabindex++;
$(this).attr("tabindex","TabIndex " +tabindex);
var tabIndex = $(this).attr("tabindex");
// add tab index number to each list items as their title
$(this).attr("title",tabIndex);
$(this).append('<br/><em>My tabIndex is number: '+tabIndex+'<em>')
})
});