diff --git a/package-lock.json b/package-lock.json
index b68c3f2..7f9f5ea 100644
Binary files a/package-lock.json and b/package-lock.json differ
diff --git a/package.json b/package.json
index f80d88d..31cc93f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@fwdekker/template",
-    "version": "2.6.0",
+    "version": "2.7.0",
     "description": "The base template for pages on fwdekker.com.",
     "author": "Florine W. Dekker",
     "license": "MIT",
@@ -27,17 +27,17 @@
         "normalize.css": "^8.0.1"
     },
     "devDependencies": {
-        "grunt": "^1.4.1",
+        "grunt": "^1.5.3",
         "grunt-cli": "^1.4.3",
-        "grunt-contrib-clean": "^2.0.0",
+        "grunt-contrib-clean": "^2.0.1",
         "grunt-contrib-cssmin": "^4.0.0",
         "grunt-contrib-watch": "^1.1.0",
         "grunt-focus": "^1.0.0",
         "grunt-webpack": "^5.0.0",
-        "ts-loader": "^9.2.8",
+        "ts-loader": "^9.3.1",
         "ts-node": "^10.7.0",
-        "typescript": "^4.6.3",
-        "webpack": "^5.70.0",
-        "webpack-cli": "^4.9.2"
+        "typescript": "^4.7.4",
+        "webpack": "^5.74.0",
+        "webpack-cli": "^4.10.0"
     }
 }
diff --git a/src/main/js/template.js b/src/main/js/template.js
index ed0c12a..7651c7e 100644
--- a/src/main/js/template.js
+++ b/src/main/js/template.js
@@ -10,20 +10,22 @@ const stringToHtml = function(string, query) {
 }
 
 /**
- * Alias for `document.querySelector`.
+ * Alias for `root.querySelector(query)`.
  *
- * @param q {string} the query string
- * @returns {HTMLElement} the element identified by the query string
+ * @param query {string} the query string
+ * @param root {HTMLElement} the element to start searching in, or `undefined` if searching should start in `document`
+ * @returns {HTMLElement} the element identified by `query` in `root`
  */
-const $ = q => document.querySelector(q);
+const $ = (query, root) => root === undefined ? document.querySelector(query) : root.querySelector(query);
 
 /**
- * Alias for `document.querySelectorAll`.
+ * Alias for `root.querySelectorAll(query)`.
  *
- * @param q {string} the query string
- * @returns {NodeListOf<HTMLElement>} the elements identified by the query string
+ * @param query {string} the query string
+ * @param root {HTMLElement} the element to start searching in, or `undefined` if searching should start in `document`
+ * @returns {NodeListOf<HTMLElement>} the elements identified by `query` in `root`
  */
-const $a = q => document.querySelectorAll(q);
+const $a = (query, root) => root === undefined ? document.querySelectorAll(query) : root.querySelectorAll(query);
 
 /**
  * Runs the given function once the page is loaded.