remove jQuery dependency

_layouts/default.html

@@ -36,11 +36,6 @@
       media="screen"
       charset="utf-8"
     />
-    <script
-      src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
-      integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
-      crossorigin="anonymous"
-    ></script>
     <script
       src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
       integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
@@ -74,8 +69,19 @@
 
       hljs.initHighlightingOnLoad();
 
-      $(function() {
-        $("#toc").append('<div class="hint">(creates this)</div>');
+      function ready(fn) {
+        if (document.readyState !== "loading") {
+          fn();
+        } else {
+          document.addEventListener("DOMContentLoaded", fn);
+        }
+      }
+
+      ready(function() {
+        var div = document.createElement("div");
+        div.innerText = "(creates this)";
+        div.classList.add("hint");
+        document.querySelector("#toc").appendChild(div);
       });
     </script>
   </head>

bootstrap-toc.js

@@ -2,24 +2,40 @@
  * Bootstrap Table of Contents v<%= version %> (http://afeld.github.io/bootstrap-toc/)
  * Copyright 2015 Aidan Feldman
  * Licensed under MIT (https://github.com/afeld/bootstrap-toc/blob/gh-pages/LICENSE.md) */
-(function($) {
+(function() {
   "use strict";
 
   window.Toc = {
     helpers: {
       // return all matching elements in the set, or their descendants
-      findOrFilter: function($el, selector) {
-        // http://danielnouri.org/notes/2011/03/14/a-jquery-find-that-also-finds-the-root-element/
-        // http://stackoverflow.com/a/12731439/358804
-        var $descendants = $el.find(selector);
-        return $el
-          .filter(selector)
-          .add($descendants)
-          .filter(":not([data-toc-skip])");
+      findOrFilter: function(el, selector) {
+        var parent = el.parentElement || el;
+        var descendants = parent.querySelectorAll(selector);
+        var arr = [];
+
+        for (var i = 0; i < descendants.length; i++) {
+          var descendent = descendants[i];
+          if (
+            descendent === el ||
+            (descendent.parentElement !== el.parentElement &&
+              descendent.getAttribute("data-toc-skip") === null)
+          ) {
+            arr.push(descendent);
+          }
+        }
+
+        return arr.filter(function(item) {
+          if (item === el) return true;
+          while (item !== null) {
+            if (item.parentElement === el) return true;
+            item = item.parentElement;
+          }
+          return false;
+        });
       },
 
       generateUniqueIdBase: function(el) {
-        var text = $(el).text();
+        var text = el.textContent;
 
         // adapted from
         // https://github.com/bryanbraun/anchorjs/blob/65fede08d0e4a705f72f1e7e6284f643d5ad3cf3/anchor.js#L237-L257
@@ -68,36 +84,39 @@
       },
 
       createNavList: function() {
-        return $('<ul class="nav navbar-nav"></ul>');
+        var ul = document.createElement("ul");
+        ul.classList.add("nav", "navbar-nav");
+        return ul;
       },
 
-      createChildNavList: function($parent) {
-        var $childList = this.createNavList();
-        $parent.append($childList);
-        return $childList;
+      createChildNavList: function(parent) {
+        var childList = this.createNavList();
+        parent.appendChild(childList);
+        return childList;
       },
 
       generateNavEl: function(anchor, text) {
-        var $a = $('<a class="nav-link"></a>');
-        $a.attr("href", "#" + anchor);
-        $a.text(text);
-        var $li = $("<li></li>");
-        $li.append($a);
-        return $li;
+        var a = document.createElement("a");
+        a.classList.add("nav-link");
+        a.setAttribute("href", "#" + anchor);
+        a.innerText = text;
+        var li = document.createElement("li");
+        li.appendChild(a);
+        return li;
       },
 
       generateNavItem: function(headingEl) {
         var anchor = this.generateAnchor(headingEl);
-        var $heading = $(headingEl);
-        var text = $heading.data("toc-text") || $heading.text();
+        var text =
+          headingEl.getAttribute("data-toc-text") || headingEl.textContent;
         return this.generateNavEl(anchor, text);
       },
 
       // Find the first heading level (`<h1>`, then `<h2>`, etc.) that has more than one element. Defaults to 1 (for `<h1>`).
-      getTopLevel: function($scope) {
+      getTopLevel: function(scope) {
         for (var i = 1; i <= 6; i++) {
-          var $headings = this.findOrFilter($scope, "h" + i);
-          if ($headings.length > 1) {
+          var headings = this.findOrFilter(scope, "h" + i);
+          if (headings.length > 1) {
             return i;
           }
         }
@@ -106,75 +125,83 @@
       },
 
       // returns the elements for the top level, and the next below it
-      getHeadings: function($scope, topLevel) {
+      getHeadings: function(scope, topLevel) {
         var topSelector = "h" + topLevel;
 
         var secondaryLevel = topLevel + 1;
         var secondarySelector = "h" + secondaryLevel;
 
-        return this.findOrFilter($scope, topSelector + "," + secondarySelector);
+        return this.findOrFilter(scope, topSelector + "," + secondarySelector);
       },
 
       getNavLevel: function(el) {
         return parseInt(el.tagName.charAt(1), 10);
       },
 
-      populateNav: function($topContext, topLevel, $headings) {
-        var $context = $topContext;
-        var $prevNav;
+      populateNav: function(topContext, topLevel, headings) {
+        var context = topContext;
+        var prevNav;
 
         var helpers = this;
-        $headings.each(function(i, el) {
-          var $newNav = helpers.generateNavItem(el);
+        headings.forEach(function(el) {
+          var newNav = helpers.generateNavItem(el);
           var navLevel = helpers.getNavLevel(el);
 
-          // determine the proper $context
+          // determine the proper context
           if (navLevel === topLevel) {
             // use top level
-            $context = $topContext;
-          } else if ($prevNav && $context === $topContext) {
+            context = topContext;
+          } else if (prevNav && context === topContext) {
             // create a new level of the tree and switch to it
-            $context = helpers.createChildNavList($prevNav);
-          } // else use the current $context
+            context = helpers.createChildNavList(prevNav);
+          } // else use the current context
 
-          $context.append($newNav);
+          context.appendChild(newNav);
 
-          $prevNav = $newNav;
+          prevNav = newNav;
         });
       },
 
       parseOps: function(arg) {
         var opts;
-        if (arg.jquery) {
+        if (arg instanceof Element) {
           opts = {
-            $nav: arg
+            nav: arg
           };
         } else {
           opts = arg;
         }
-        opts.$scope = opts.$scope || $(document.body);
+        opts.scope = opts.scope || document.body;
         return opts;
       }
     },
 
-    // accepts a jQuery object, or an options object
+    // accepts an Element object, or an options object
     init: function(opts) {
       opts = this.helpers.parseOps(opts);
 
       // ensure that the data attribute is in place for styling
-      opts.$nav.attr("data-toggle", "toc");
+      opts.nav.setAttribute("data-toggle", "toc");
 
-      var $topContext = this.helpers.createChildNavList(opts.$nav);
-      var topLevel = this.helpers.getTopLevel(opts.$scope);
-      var $headings = this.helpers.getHeadings(opts.$scope, topLevel);
-      this.helpers.populateNav($topContext, topLevel, $headings);
+      var topContext = this.helpers.createChildNavList(opts.nav);
+      var topLevel = this.helpers.getTopLevel(opts.scope);
+      var headings = this.helpers.getHeadings(opts.scope, topLevel);
+      this.helpers.populateNav(topContext, topLevel, headings);
     }
   };
 
-  $(function() {
-    $('nav[data-toggle="toc"]').each(function(i, el) {
-      var $nav = $(el);
-      Toc.init($nav);
-    });
+  function ready(fn) {
+    if (document.readyState !== "loading") {
+      fn();
+    } else {
+      document.addEventListener("DOMContentLoaded", fn);
+    }
+  }
+
+  ready(function() {
+    var navs = document.querySelectorAll('nav[data-toggle="toc"]');
+    for (var i = 0; i < navs.length; i++) {
+      Toc.init(navs[i]);
+    }
   });
-})(jQuery);
+})();

package.json

@@ -15,7 +15,6 @@
     "gulp-rename": "^1.4.0",
     "gulp-template": "^5.0.0",
     "gulp-uglify": "^3.0.1",
-    "jquery": "^3.5.0",
     "jshint": "^2.9.1-rc1",
     "mocha": "^5.2.0"
   }

test/index.html

@@ -8,7 +8,6 @@
     <div id="mocha"></div>
     <div id="mocha-fixture">foo</div>
 
-    <script src="../node_modules/jquery/dist/jquery.min.js"></script>
     <script src="../node_modules/expect.js/index.js"></script>
     <script src="../node_modules/mocha/mocha.js"></script>
 
@@ -19,7 +18,6 @@
     <script src="toc-test.js"></script>
     <script>
       mocha.checkLeaks();
-      mocha.globals(["jQuery"]);
       mocha.run();
     </script>
   </body>