$(document).ready(function() { if ($('ol:first').css('list-style-type') != 'none') { /* For IE6/7 only. */ $('ol ol').each(function(i, ol) { ol = $(ol); var level1 = ol.closest('li').index() + 1; ol.children('li').each(function(i, li) { li = $(li); var level2 = level1 + '.' + (li.index() + 1); li.prepend('<span>' + level2 + '</span>'); }); }); } });
ol{margin:15px;} html>/**/body ol { /* Won't be interpreted by IE6/7. */ list-style-type: none; counter-reset: level1; } ol li:before { content: counter(level1) ". "; counter-increment: level1; } ol li ol { list-style-type: none; counter-reset: level2; } ol li ol li:before { content: counter(level1) "." counter(level2) " "; counter-increment: level2; } ol li span { /* For IE6/7. */ margin: 0 5px 0 -25px; }
<ol> <li>List</li> <li>List <ol> <li>List</li> <li>List</li> <li>List</li> </ol> </li> <li>List</li> <li>List</li> </ol>