AJAX Загрузка и синхронизация рендеринга MathJax

Question

Хорошо, теперь я знаю, что об этом спрашивали много раз, но я не могу заставить это работать.Я создаю сайт Jekyll, размещенный на github, и для загрузки используется AJAX.Проблема в том, что любой вставленный LaTex изначально не отображается, если я не обновлю страницу.Я прочитал много постов, в которых предлагалось использовать следующее:

MathJax.Hub.Queue(["Typeset",MathJax.Hub]);

Я не уверен, что проблема в том, где я вставляю этот скрипт, или я просто пропускаю что-то еще.Кто-нибудь сталкивался с подобной проблемой?

Этот бит кода вставляется в заголовок каждой страницы:

<script type="text/javascript" async
  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js">
</script>

Я знаю, что скрипт работает, потому что, когда я перезагружаю страницу, отображается LaTeX.Это пример файла уценки, на котором я тестировал проблему рендеринга.

## Math

Lorem ipsum $$ f(x) = x^2 $$.

$$
\begin{aligned}
  \phi(x,y) &= \phi \left(\sum_{i=1}^n x_ie_i, \sum_{j=1}^n y_je_j \right) \\[2em]
            &= \sum_{i=1}^n \sum_{j=1}^n x_i y_j \phi(e_i, e_j)            \\[2em]
            &= (x_1, \ldots, x_n)
               \left(\begin{array}{ccc}
                 \phi(e_1, e_1)  & \cdots & \phi(e_1, e_n) \\
                 \vdots          & \ddots & \vdots         \\
                 \phi(e_n, e_1)  & \cdots & \phi(e_n, e_n)
               \end{array}\right)
               \left(\begin{array}{c}
                 y_1    \\
                 \vdots \\
                 y_n
               \end{array}\right)
\end{aligned}
$$