title: Mathjax not rendering equation unless page reloaded
body: <p>Im using mathjax in my rails project via the CDN because of issues hosting it in my app. </p>
  
  <p>I'm using mathjax with the following</p>
  
  <pre><code>&lt;script type="text/javascript" src="http://www.hostmath.com/Math/MathJax.js?config=OK"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>There is one div element that renders a partial depending on what button the user clicks on the page. Partial "Other" has other stuff and partial "Math" has the math equation. There is a button for the corresponding partials.</p>
  
  <p>The first time the user clicks "Math" all the equations in the math partial render properly. If the user clicks "Other" and then clicks "Math" again, the math equations are not rendered properly. Only raw math syntax showing. </p>
  
  <p>I was reading that it may be because MathJax is typesetting only on page load but I don't understand why the formatting would change when the rendered partial changed.</p>
  
  <p>So I added the following which I found online to test if it would solve my problem:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    MathJax.Hub.Queue(
    ["resetEquationNumbers",MathJax.InputJax.TeX],
    ["Typeset",MathJax.Hub]
  );
  &lt;/script&gt;
  </code></pre>
  
  <p>Now it works like I wanted. The user can click the buttons for the "Math" or "Other" partials in any order without reloading the page and the equations render properly. </p>
  
  <p>The problem is I have a js error:</p>
  
  <pre><code>Uncaught ReferenceError: MathJax is not defined
  </code></pre>
  
  <p>How do use the above code (MathJax.Hub.Queue...) when MathJax is referenced via the CDN instead of my local server? I also don't understand why adding the above code fixed the problem when "MathJax" is undefined.</p>
  
  <p>I think I need to configure a local configuration file to get around the issue based on what I read in the <a href="http://docs.mathjax.org/en/latest/configuration.html#using-a-local-configuration-file-with-the-cdn" rel="nofollow">docs</a> but I don't understand them. Can anyone help?</p>
  
  <p>Here is the partial with the math equation</p>
  
  <pre><code>&lt;div class="custom-in-page-pages-view"&gt;
    &lt;div class="text-center"&gt;
      &lt;h1&gt;Part 1&lt;/h1&gt;
      &lt;h4&gt;General 3d Motion Equation&lt;/h4&gt;&lt;br&gt;&lt;br&gt;
    &lt;/div&gt;
  
  &lt;math&gt;
    &lt;mrow&gt;
      &lt;mtext selected="true"&gt;r&lt;/mtext&gt;
      &lt;mo&gt;=&lt;/mo&gt;
      &lt;mtext&gt;r&lt;/mtext&gt;
      &lt;mtext mathvariant="italic"&gt;(t)&lt;/mtext&gt;
      &lt;mo&gt;=&lt;/mo&gt;
      &lt;mtext mathvariant="italic"&gt;r&lt;/mtext&gt;
      &lt;msub&gt;
        &lt;mtext&gt;&amp;ecirc;&lt;/mtext&gt;
        &lt;mtext mathvariant="italic"&gt;r&lt;/mtext&gt;
      &lt;/msub&gt;
    &lt;/mrow&gt;
  &lt;/math&gt;
  
  &lt;br&gt;
  &lt;br&gt;
  
  &lt;math&gt;
    &lt;mrow&gt;
      &lt;mtext&gt;v&lt;/mtext&gt;
      &lt;mo&gt;=&lt;/mo&gt;
      &lt;mtext mathvariant="italic"&gt;v&lt;/mtext&gt;
      &lt;msub&gt;
        &lt;mtext&gt;&amp;ecirc;&lt;/mtext&gt;
        &lt;mtext&gt;r&lt;/mtext&gt;
      &lt;/msub&gt;
      &lt;mo&gt;+&lt;/mo&gt;
      &lt;mtext mathvariant="italic"&gt;r&lt;/mtext&gt;
      &lt;mfrac&gt;
        &lt;mtext mathvariant="italic"&gt;d&amp;theta;&lt;/mtext&gt;
        &lt;mtext mathvariant="italic"&gt;dt&lt;/mtext&gt;
      &lt;/mfrac&gt;
      &lt;msub&gt;
        &lt;mtext&gt;&amp;ecirc;&lt;/mtext&gt;
        &lt;mtext selected="true" mathvariant="italic"&gt;&amp;theta;&lt;/mtext&gt;
      &lt;/msub&gt;
      &lt;mo&gt;+&lt;/mo&gt;
      &lt;mtext mathvariant="italic"&gt;r&lt;/mtext&gt;
      &lt;mfrac&gt;
        &lt;mtext mathvariant="italic"&gt;d&amp;phiv;&lt;/mtext&gt;
        &lt;mtext mathvariant="italic"&gt;dt&lt;/mtext&gt;
      &lt;/mfrac&gt;
      &lt;mtext mathvariant="normal"&gt;sin&lt;/mtext&gt;
      &lt;mtext mathvariant="italic"&gt;&amp;theta;&lt;/mtext&gt;
      &lt;msub&gt;
        &lt;mtext&gt;&amp;ecirc;&lt;/mtext&gt;
        &lt;mtext mathvariant="italic"&gt;&amp;phiv;&lt;/mtext&gt;
      &lt;/msub&gt;
    &lt;/mrow&gt;
  &lt;/math&gt;
  
  &lt;br&gt;
  &lt;br&gt;
  
  &lt;math&gt;
    &lt;mrow&gt;
      &lt;mtext selected="true"&gt;a&lt;/mtext&gt;
      &lt;mo&gt;=&lt;/mo&gt;
      &lt;mfenced open="(" close=")"&gt;
        &lt;mrow&gt;
          &lt;mtext mathvariant="italic"&gt;a&lt;/mtext&gt;
          &lt;mo&gt;-&lt;/mo&gt;
          &lt;mtext mathvariant="italic"&gt;r&lt;/mtext&gt;
          &lt;mo&gt;&amp;nbsp;&lt;/mo&gt;
          &lt;msup&gt;
            &lt;mfenced open="(" close=")"&gt;
              &lt;mfrac&gt;
                &lt;mtext mathvariant="italic"&gt;d&amp;theta;&lt;/mtext&gt;
                &lt;mtext mathvariant="italic"&gt;dt&lt;/mtext&gt;
              &lt;/mfrac&gt;
            &lt;/mfenced&gt;
            &lt;mn&gt;2&lt;/mn&gt;
          &lt;/msup&gt;
          &lt;mo&gt;-&lt;/mo&gt;
          &lt;mtext mathvariant="italic"&gt;r&lt;/mtext&gt;
          &lt;mo&gt;&amp;nbsp;&lt;/mo&gt;
          &lt;msup&gt;
            &lt;mfenced open="(" close=")"&gt;
              &lt;mfrac&gt;
                &lt;mtext mathvariant="italic"&gt;d&amp;phiv;&lt;/mtext&gt;
                &lt;mtext mathvariant="italic"&gt;dt&lt;/mtext&gt;
              &lt;/mfrac&gt;
            &lt;/mfenced&gt;
            &lt;mn&gt;2&lt;/mn&gt;
          &lt;/msup&gt;
          &lt;mo&gt;&amp;nbsp;&lt;/mo&gt;
          &lt;msup&gt;
            &lt;mtext mathvariant="normal"&gt;sin&lt;/mtext&gt;
            &lt;mn&gt;2&lt;/mn&gt;
          &lt;/msup&gt;
          &lt;mtext mathvariant="italic"&gt;&amp;theta;&lt;/mtext&gt;
        &lt;/mrow&gt;
      &lt;/mfenced&gt;
      &lt;mo&gt;&amp;nbsp;&lt;/mo&gt;
      &lt;msub&gt;
        &lt;mtext&gt;&amp;ecirc;&lt;/mtext&gt;
        &lt;mtext&gt;r&lt;/mtext&gt;
      &lt;/msub&gt;
    &lt;/mrow&gt;
  &lt;/math&gt;
  
  &lt;br&gt;
  &lt;br&gt;
  
  &lt;math&gt;
    &lt;mrow&gt;
      &lt;mo&gt;+&lt;/mo&gt;
      &lt;mfenced open="(" close=")"&gt;
        &lt;mrow&gt;
          &lt;mtext&gt;r&lt;/mtext&gt;
          &lt;mfrac&gt;
            &lt;mrow&gt;
              &lt;msup&gt;
                &lt;mtext mathvariant="italic"&gt;d&lt;/mtext&gt;
                &lt;mn&gt;2&lt;/mn&gt;
              &lt;/msup&gt;
              &lt;mtext mathvariant="italic"&gt;&amp;theta;&lt;/mtext&gt;
            &lt;/mrow&gt;
            &lt;mrow&gt;
              &lt;mtext mathvariant="italic"&gt;d&lt;/mtext&gt;
              &lt;msup&gt;
                &lt;mtext mathvariant="italic"&gt;t&lt;/mtext&gt;
                &lt;mn&gt;2&lt;/mn&gt;
              &lt;/msup&gt;
            &lt;/mrow&gt;
          &lt;/mfrac&gt;
          &lt;mo&gt;+&lt;/mo&gt;
          &lt;mtext mathvariant="italic"&gt;2v&lt;/mtext&gt;
          &lt;mfrac&gt;
            &lt;mtext mathvariant="italic"&gt;d&amp;theta;&lt;/mtext&gt;
            &lt;mtext mathvariant="italic"&gt;dt&lt;/mtext&gt;
          &lt;/mfrac&gt;
          &lt;mo&gt;-&lt;/mo&gt;
          &lt;mtext mathvariant="italic"&gt;r&lt;/mtext&gt;
          &lt;mo&gt;&amp;nbsp;&lt;/mo&gt;
          &lt;msup&gt;
            &lt;mfenced open="(" close=")"&gt;
              &lt;mfrac&gt;
                &lt;mtext mathvariant="italic"&gt;d&amp;phiv;&lt;/mtext&gt;
                &lt;mtext mathvariant="italic"&gt;dt&lt;/mtext&gt;
              &lt;/mfrac&gt;
            &lt;/mfenced&gt;
            &lt;mn&gt;2&lt;/mn&gt;
          &lt;/msup&gt;
          &lt;mo&gt;&amp;nbsp;&lt;/mo&gt;
          &lt;mtext mathvariant="normal"&gt;sin&lt;/mtext&gt;
          &lt;mtext mathvariant="italic"&gt;&amp;theta;&lt;/mtext&gt;
          &lt;mtext mathvariant="normal"&gt;cos&lt;/mtext&gt;
          &lt;mtext mathvariant="italic"&gt;&amp;theta;&lt;/mtext&gt;
        &lt;/mrow&gt;
      &lt;/mfenced&gt;
      &lt;mo&gt;&amp;nbsp;&lt;/mo&gt;
      &lt;msub&gt;
        &lt;mtext&gt;&amp;ecirc;&lt;/mtext&gt;
        &lt;mtext selected="true" mathvariant="italic"&gt;&amp;theta;&lt;/mtext&gt;
      &lt;/msub&gt;
    &lt;/mrow&gt;
  &lt;/math&gt;
  
  &lt;br&gt;
  &lt;br&gt;
  
  &lt;math&gt;
    &lt;mrow&gt;
      &lt;mo mathvariant="italic"&gt;+&lt;/mo&gt;
      &lt;mfenced open="(" close=")"&gt;
        &lt;mrow&gt;
          &lt;mtext mathvariant="italic"&gt;r&lt;/mtext&gt;
          &lt;mfrac&gt;
            &lt;mrow&gt;
              &lt;msup&gt;
                &lt;mtext mathvariant="italic"&gt;d&lt;/mtext&gt;
                &lt;mn&gt;2&lt;/mn&gt;
              &lt;/msup&gt;
              &lt;mtext mathvariant="italic"&gt;&amp;phiv;&lt;/mtext&gt;
            &lt;/mrow&gt;
            &lt;mrow&gt;
              &lt;mtext mathvariant="italic"&gt;d&lt;/mtext&gt;
              &lt;msup&gt;
                &lt;mtext mathvariant="italic"&gt;t&lt;/mtext&gt;
                &lt;mn&gt;2&lt;/mn&gt;
              &lt;/msup&gt;
            &lt;/mrow&gt;
          &lt;/mfrac&gt;
          &lt;mtext mathvariant="normal"&gt;sin&lt;/mtext&gt;
          &lt;mtext mathvariant="italic"&gt;&amp;theta;&lt;/mtext&gt;
          &lt;mo&gt;+&lt;/mo&gt;
          &lt;mtext&gt;2&lt;/mtext&gt;
          &lt;mtext mathvariant="italic"&gt;v&lt;/mtext&gt;
          &lt;mfrac&gt;
            &lt;mtext mathvariant="italic"&gt;d&amp;phiv;&lt;/mtext&gt;
            &lt;mtext mathvariant="italic"&gt;dt&lt;/mtext&gt;
          &lt;/mfrac&gt;
          &lt;mtext mathvariant="normal"&gt;sin&lt;/mtext&gt;
          &lt;mtext mathvariant="italic"&gt;&amp;theta;&lt;/mtext&gt;
          &lt;mo&gt;+&lt;/mo&gt;
          &lt;mtext&gt;2&lt;/mtext&gt;
          &lt;mtext mathvariant="italic"&gt;r&lt;/mtext&gt;
          &lt;mfrac&gt;
            &lt;mtext mathvariant="italic"&gt;d&amp;theta;&lt;/mtext&gt;
            &lt;mtext mathvariant="italic"&gt;dt&lt;/mtext&gt;
          &lt;/mfrac&gt;
          &lt;mfrac&gt;
            &lt;mtext mathvariant="italic"&gt;d&amp;phiv;&lt;/mtext&gt;
            &lt;mtext mathvariant="italic"&gt;dt&lt;/mtext&gt;
          &lt;/mfrac&gt;
          &lt;mtext mathvariant="normal"&gt;cos&lt;/mtext&gt;
          &lt;mtext mathvariant="italic"&gt;&amp;theta;&lt;/mtext&gt;
        &lt;/mrow&gt;
      &lt;/mfenced&gt;
      &lt;mo&gt;&amp;nbsp;&lt;/mo&gt;
      &lt;msub&gt;
        &lt;mtext&gt;&amp;ecirc;&lt;/mtext&gt;
        &lt;mtext selected="true" mathvariant="italic"&gt;&amp;phiv;&lt;/mtext&gt;
      &lt;/msub&gt;
    &lt;/mrow&gt;
  &lt;/math&gt;
  
  &lt;br&gt;
  
  
  &lt;/div&gt;
  
  
  
  
  &lt;script type="text/javascript"
    src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"&gt;
  &lt;/script&gt;
  
  &lt;script type="text/javascript"&gt;
    MathJax.Hub.Queue(
    ["resetEquationNumbers",MathJax.InputJax.TeX],
    ["Typeset",MathJax.Hub]
  );
  &lt;/script&gt;
  </code></pre>
  
  <p>This is to get past a issue I only see when testing in Chrome. I didn't see the problem that required the use of MathJax.Hub.Queue... when viewing code in Firefox and Safari.</p>