How to add Accessible Mathematics to your rise course. (Including Super and Sub Scripts and Formulas)

<script>
  var mathJaxPromise = null;
  MathJax = {
    tex: {
      inlineMath: [['\\(', '\\)']]
    },

    startup: {
      ready: () => {
        MathJax.startup.defaultReady(); // Make sure MathJax is initialized
        // Whenever there's a DOM change, check the dynamic content for LaTex
        var observer = new MutationObserver(function () {
          if (mathJaxPromise) {
            mathJaxPromise.then(function () {
              mathJaxPromise = MathJax.typesetPromise();
            });
          }
          else {
            mathJaxPromise = MathJax.typesetPromise();
          }
        });

        observer.observe(document.body, {
          attributes: true,
          attributeFilter: ["id", "dir"],
          attributeOldValue: true,
          childList: true
        });
      }
    }
  };

  function typeset() {
    MathJax.startup.promise = MathJax.startup.promise
      .then(() => MathJax.typesetPromise())
      .catch((err) => console.log('Typeset failed: ' + err.message));
    return MathJax.startup.promise;
  }
  // Check for changes in the hash location in the address bar
  addEventListener("hashchange", (event) => {
    typeset();
  });

</script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<!-- Uncomment one of the scripts below to use either chtml or svg. I defaulted to SVG for widest support -->
<!-- svg (use scalable images) -->
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-svg.js"></script>
<!-- chtml (use html/fonts and css (beware of EDGE) -->
<!-- <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script> -->

Edit: 1/29/2024 - Updated to account for breaking changes.  This now detects changes in the # location in the address bar to reapply mathjax.