<p>Писатели:</p>
<div class="box">
<p>Писатели:</p>
<ul>
<li>Пушкин</li>
<li>Лермонтов</li>
<li>Чехов</li>
<li>
<ul>
<li>Пушкин</li>
<li>Лермонтов</li>
<li>Чехов</li>
</ul>
</li>
</ul>
</div>
<div class="box">
<p>Художники:</p>
<ul>
<li>Винсент ван Гог</li>
<li>Сальвадор Дали</li>
<li>Эдвард Мунк</li>
<li>
<ul>
<li>Пушкин</li>
<li>Лермонтов</li>
<li>Чехов</li>
</ul>
</li>
</ul>
</div>
body {
counter-reset: cnt 0;
}
li {
counter-increment: cnt 1;
}
li::before {
content: counter(cnt) ". ";
}
li>ul {
counter-reset: cnt-2 0;
}
li>ul>li {
counter-increment: cnt-2 1;
}
li>ul>li::before {
content: counter(cnt-2) ". ";
}
В таком случае достаточно просто заменять контент в элементе, в котором вы значение этого счётчика собираетесь выводить.
К примеру, у вас есть примерно такая разметка:
И, соответственно, для неё скрипт будет примерно таким