Prepending text to list items without class or id tags

I’m working with the Docsify.js markdown parser framework and it automatically creates a sidebar from the headings in a document (unless you manually create a sidebar).

I have some CSS that numbers list elements, but want to convert it to JS as there are rendering issues when classes are added as the page scrolls (ie. adding .active).

Originally I was trialling using this snippet but it doesn’t output it as an auto incrementing hierarchical number system:

var li = document.getElementsByTagName( 'li' );
for( var i = 0; i < li.length; i++ ) {
  var prefix = '1.';
  li[i].innerHTML = prefix + ' Title ' + i;
  prefix++;
}

The sidebar that is generated is in the following format:

<aside class="sidebar">
  <div class="sidebar-nav">
    <ul>
      <li>Title 1</li>
      <ul>
        <li>Title 2</li>
        <ul>
          <li>Title 3</li>
          <ul>
            <li>Title 4</li>
            <ul>
              <li>Title 5</li>
              <ul>
                <li>Title 6</li>
              </ul>
            </ul>
          </ul>
        </ul>
      </ul>
      <li>Title 1</li>
      <ul>
        <li>Title 2</li>
        <ul>
          <li>Title 3</li>
          <ul>
            <li>Title 4</li>
            <ul>
              <li>Title 5</li>
              <ul>
                <li>Title 6</li>
              </ul>
            </ul>
          </ul>
        </ul>
      </ul>
    </ul>
  </div>
</aside>

I understand the HTML structure isn’t valid with <ul> being a descendant of an <ul> but this is the code that is outputted and I have no control over it.

However, I want to be able to number the headings with sections and sub-sections:

1. Title 1
 1.1. Title 2
  1.1.1. Title 3
   1.1.1.1. Title 4
    1.1.1.1.1. Title 5
     1.1.1.1.1.1. Title 6
2. Title 7
 2.1. Title 8
  2.1.1. Title 9
   2.1.1.1. Title 0
    2.1.1.1.1. Title 1
     2.1.1.1.1.1. Title 2

I’m struggling to find a way to be able to target the first <li> (or the H1), and then being able to access the next <ul> via .nextElementSibling to continue the loop and prepend the numbering.

As far as I have gotten to at the moment is: document.querySelectorAll( 'div.sidebar-nav > ul' ) and its not much to go on!

I think I’m really out of my depth for javascript here, and was hoping that I’d be able to get some help on being able to loop through the <li> and ` elements to prepend the numbers.