1

So I am trying to generate a lower case sigma using a HTML code similar to

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>MathJax example</title>
    <script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js?config=TeX-MML-AM_CHTML" async>
    </script>
</head>

<body>
    <p id="This_Is_What_I_Want"> $$ \sigma^2 $$</p>
    <p id="Output"></p>
    <p id="Activate"><button onclick="RUN()">Test This out</button></p>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS_HTML,http://myserver.com/MathJax/config/local/local.js">
        function RUN() {
            document.getElementById("Output").innerHTML = "$$ \sigma^2 $$";
            MathJax.Hub.Queue(["Typeset", MathJax.Hub]);
        }
    </script>
</body>

The first sigma loads correctly but when I hit the button the second one will not load correctly

WHY!

Community
  • 1
  • 1
Alex Carlson
  • 99
  • 9
  • Why? Because JavaScript encodes strings differently from HTML. – Peter Krautzberger Nov 19 '18 at 07:12
  • I actually fixed the issue, already in the answer below, I was missing a single \\ – Alex Carlson Nov 19 '18 at 07:16
  • 1
    This is not a mathjax issue, this is how work [javascript strings](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String). `console.log("$$ \sigma^2 $$");` output is `$$ sigma^2 $$`. You have to escape backslash or use String.raw(). [Read more on SO](https://stackoverflow.com/questions/10041998/how-can-i-use-backslashes-in-a-string#10042082) – scraaappy Nov 19 '18 at 10:26
  • its ok @scraaappy I fixed the issue in the answer provided. I realized I did not read that for the setup provided I have to use \\ if i am attempting to generate this item from my script and using the MathJax.Hub.Queue(["Typeset", MathJax.Hub]); – Alex Carlson Nov 19 '18 at 23:43

1 Answers1

0
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>MathJax example</title>
    <script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js?config=TeX-MML-AM_CHTML" async>
    </script>
</head>

<body>
    <p id="This_Is_What_I_Want"> $$ \sigma^2 $$</p>
    <p id="Output"></p>
    <p id="Activate"><button onclick="RUN()">Test This out</button></p>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS_HTML,http://myserver.com/MathJax/config/local/local.js">
        function RUN() {
            document.getElementById("Output").innerHTML = "$$ \\sigma^2 $$";
            MathJax.Hub.Queue(["Typeset", MathJax.Hub]);
        }
    </script>
</body>

apparently I did not read instructions on the documentation but the default is you need two \ as opposed to one

Alex Carlson
  • 99
  • 9