Nesting "for of" inside of a "forEach"
Is there a better way to write the JS?

Yes there is.
First off, lets face it, your function fixMenus looks quite complex and a double for loop in one function is usually a big &quot;no no&quot; sign. Any company with a coding standard would want this to be different.
You have a double for loop with some conditions and some HTML building. That's a lot for one function and it looks hard to test accurately.
Your function does the following things

Loops through each menu
Destructures some data
Loops through a sublist to apply a class
Applies the new menu to the variable

So instead of having one function handle all this, let's break it up.
Make small simple functions that are easy to test
The concept of Test Driven Development (TDD) forces you to write code that is:

Easy to understand
Easy to test

This by itself already forces you to write better code and smaller functions.
You're probably not doing TDD, but writing code as if you were is already a great step!
Focus on the simple tasks

fixMenus should call generateMenus and ultimately generateMenu
Use Array#map and Array#join instead of forEach
create a function to update the actives
create a function to generate your html string

function updateActives(subItems){
   for (let i of subItems) {
      if (i.firstElementChild.href === window.location.href) {
        i.firstElementChild.classList.add(`is-active`);
      }
   }
}

function createMenu(labels, subMenus){
  return `
    &lt;p class=&quot;menu-label&quot;&gt;${labels}&lt;/p&gt;
    &lt;ul class=&quot;menu-list&quot;&gt;
       ${subMenus}
    &lt;/ul&gt;
  `
}

function generateMenu(item){
  const {children:[elem1, elem2]} = item;
  updateActives(elem2.children);
  return createMenu(elem1.innerHTML, elem2.innerHTML);
}

function generateMenus(items){
  return items.map(item =&gt; generateMenu(item)).join(&quot;&quot;);
}

function fixMenus(menu, items){
  menu.remove();
  return generateMenus(items);
}