title: MathJax is not defined
body: <p>I have successfully loaded and configured MathJax by pasting MathJax recommended commands into the <code>&lt;head&gt;</code> element of my webpage.  MathJax does a great job rendering LaTex in the <code>&lt;body&gt;</code> of my webpage.</p>
  
  <p>My problem is with accessing the <code>MathJax</code> object with javascript run at the very end of the <code>&lt;body&gt;</code> element.  For instance, the code below returns <code>undefined</code> to the console.  This is confusing to me- shouldn't my commands in the <code>&lt;head&gt;</code> element have created <code>MathJax</code>as a global variable that can be accessed anywhere?</p>
  
  <p>Here's a screenshot of my code:
  <a href="https://i.stack.imgur.com/SD5gF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/SD5gF.png" alt="code screenshot"></a></p>
  
  <p>Here is the relevant section of code from the <code>&lt;head&gt;</code> element:</p>
  
  <pre><code>&lt;script type="text/x-mathjax-config"&gt;
      MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
  &lt;/script&gt;
  &lt;script type="text/javascript" async
      src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML"&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p></p>
  
  <p>Here is the relevant section of code from the <code>&lt;body&gt;</code> element:</p>
  
  <pre><code>&lt;h1 class="header"&gt;
      If $ax^2+bx+c=0$, then $x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}$.
  &lt;/h1&gt;
  
  &lt;script type="text/javascript" &gt;
      console.log(window.MathJax);
  &lt;/script&gt;
  </code></pre>