Adding class to the UL and LI as per the level
- by Wazdesign
I have the following HTML mark up.
<ul class="thumbs">
<li>
<strong>Should be level 0</strong>
</li>
<li>
<strong>Should be level 1</strong>
</li>
<li>
<strong>Should be level 2</strong>
</li>
</ul>
<ul class="thumbs">
<li>
<strong>Should be level 0 -- </strong>
</li>
<li>
<strong>Should be level 1 -- </strong>
</li>
</ul>
and javascript.
var i = 0;
var j = 0;
jQuery('ul.thumbs').each(function(){
var newName = 'ul -level' + i;
jQuery(this).addClass('ul-level-'+i)
.before('<h2>'+newName+'</h2>');
i = i+1;
});
jQuery('ul.thumbs li').each(function(){
jQuery(this).addClass('li-level-'+j)
.append('li-level-'+j);
j = j+1;
});
JS Bin Link
But the level of the second UL LI is show diffrent.
Please help me out in this.
