diff --git a/src/ts/UI.ts b/src/ts/UI.ts
index a4874f1..707f480 100644
--- a/src/ts/UI.ts
+++ b/src/ts/UI.ts
@@ -1,4 +1,6 @@
-class UI {
+declare const katex: any;
+
+class UI {
     public static get blogPostContainer(): HTMLDivElement {
         return document.querySelector("#all-blog-posts");
     }
@@ -12,6 +14,7 @@
      */
     public static updateUI() {
         UI.addLineNumbers();
+        UI.renderTeX();
         UI.unescapeMarkTags();
     }
 
@@ -27,6 +30,20 @@
         });
     }
 
+    /**
+     * Renders all TeX in the document.
+     */
+    public static renderTeX() {
+        const tex = document.getElementsByClassName("math");
+        Array.from(tex).forEach(function (el: Element) {
+            let content = el.textContent.trim();
+            if (content.startsWith("\\[")) content = content.slice(2);
+            if (content.endsWith("\\]")) content = content.slice(0, -2);
+
+            katex.render(content, el);
+        });
+    }
+
     /**
      * Unescapes all <mark> tags in <pre> <code> blocks.
      */
diff --git a/src/ts/app.ts b/src/ts/app.ts
index edf7feb..c39bdc4 100644
--- a/src/ts/app.ts
+++ b/src/ts/app.ts
@@ -3,7 +3,6 @@ import TimeUtility from "./TimeUtility";
 import UI from "./UI";
 
 declare const bootstrap: any;
-declare const katex: any;
 declare const Handlebars: any;
 
 (() => {
@@ -59,15 +58,6 @@ declare const Handlebars: any;
 
     UI.updateUI();
 
-    const tex = document.getElementsByClassName("math");
-    Array.prototype.forEach.call(tex, function (el) {
-        let content = el.textContent.trim();
-        if (content.startsWith("\\[")) content = content.slice(2);
-        if (content.endsWith("\\]")) content = content.slice(0, -2);
-
-        katex.render(content, el);
-    });
-
     const timestamps = document.querySelectorAll("span[data-timestamp][data-format]");
     timestamps.forEach((timestamp) => {
         const seconds = parseInt(timestamp.getAttribute("data-timestamp"));