Fix math init logic

Author: theletterf

src/Elastic.Documentation.Site/Assets/main.ts

@@ -23,7 +23,7 @@ const isLazyLoadNavigationEnabled =
  * Initialize KaTeX math rendering for elements with class 'math'
  */
 function initMath() {
-    const mathElements = $$('.math')
+    const mathElements = $$('.math:not([data-katex-processed])')
     mathElements.forEach((element) => {
         try {
             const content = element.textContent?.trim()
@@ -56,6 +56,9 @@ function initMath() {
                     // Add common macros if needed
                 },
             })
+
+            // Mark as processed to prevent double processing
+            element.setAttribute('data-katex-processed', 'true')
         } catch (error) {
             console.warn('KaTeX rendering error:', error)
             // Fallback: keep the original content
@@ -64,6 +67,11 @@ function initMath() {
     })
 }
 
+// Initialize math on initial page load
+document.addEventListener('DOMContentLoaded', function () {
+    initMath()
+})
+
 document.addEventListener('htmx:load', function (event) {
     initTocNav()
     initHighlight()