diff --git a/src/_assets/js/main.js b/src/_assets/js/main.js
index 880ec0fa87c..b343566b4c4 100644
--- a/src/_assets/js/main.js
+++ b/src/_assets/js/main.js
@@ -40,18 +40,6 @@ function adjustToc() {
     $('html, body').animate({ scrollTop: 0 }, 'fast');
   })
 
-  // TODO: consider doing most of the HTML TOC manipulation statically (maybe requiring a jekyll-toc adaptor plugin)
-  // Bootstrap 4's ScrollSpy works only for .nav or .list-group,
-  // with items and link classes set too. Add the classes.
-  var toc = $(tocWrapper).find('ul.section-nav');
-  $(toc).addClass('nav');
-
-  var ul = $(toc).find('ul');
-  $(ul).addClass('nav');
-  var li = $(toc).find('.toc-entry');
-  $(li).addClass('nav-item');
-  $(li).find('a').addClass('nav-link');
-
   $('body').scrollspy({ offset: 100, target: tocId });
 }
 
diff --git a/src/_includes/toc.html b/src/_includes/toc.html
index 01243150c2f..790804dc3fd 100644
--- a/src/_includes/toc.html
+++ b/src/_includes/toc.html
@@ -14,6 +14,12 @@
 {% endif -%}
 
 {% assign toc = content | toc_only -%}
+{% if include.extendToc -%}
+  {% assign toc = toc | replace: '<ul>', '<ul class="nav">' %}
+  {% assign toc = toc | replace: '<ul class="section-nav">', '<ul class="section-nav nav">' %}
+  {% assign toc = toc | replace: 'class="toc-entry', 'class="toc-entry nav-item' %}
+  {% assign toc = toc | replace: '<a href="#', '<a class="nav-link" href="#' %}
+{% endif -%}
 
 {% comment %}
   A TOC without <li> elements is empty. Only generate a TOC <div> for non-empty TOCs.
diff --git a/src/_layouts/default.html b/src/_layouts/default.html
index 0eedc2756f2..dc03b1cc055 100644
--- a/src/_layouts/default.html
+++ b/src/_layouts/default.html
@@ -16,7 +16,7 @@
       {% include shared/sidenav-level-1.html nav=site.data.sidenav %}
     </div>
     {% if page.toc and layout.toc != false -%}
-      {% include toc.html kind="side" class="fixed-col col-xl-2 order-3" -%}
+      {% include toc.html kind="side" class="fixed-col col-xl-2 order-3" extendToc=true -%}
     {% endif -%}
     <main class="site-content {{main-col}}" role="main">
       <div class="container">