JSFiddle - React, Tailwind, and code Playground

HTML

<div id="content">
<ol>
  <li>1</li>
  <li>2</li>
  <li>3</li>
</ol>
<ol>
  <li>4</li>
  <li>5</li>
</ol>

CSS

ol {
  list-style-type: none;
  margin-left: 20px;
  padding: 0px;
}
ol > li {
  counter-increment: li -1;
}
ol > li:before {
  content: "[" counter(li) "]";
  padding-right: 10px;
}

JavaScript

window.onload = function() {
  var liCount = document.querySelectorAll('ol > li').length;
  document.body.setAttribute('style', 'counter-reset: li ' + (liCount + 1));
}