How to keep the MATHJAX formatting applied to the website content?

StackOverflow https://stackoverflow.com/questions/19271690

  •  30-06-2022
  •  | 
  •  

Question

I have following HTML code:

<body>
  <div id="somediv1">
    Some LATEX TEXT
  </div>
  <div id="somediv2">
    Some LATEX TEXT
  </div>
  <button id="button1"><button>
  <button id="button2"><button>

  <script>
    $('#somediv1').show();
    $('#somediv2').hide();          


    $('#button1').click(function(){
      $('#somediv1').hide();
      $('#somediv2').show();
    });
    $('#button2').click(function(){
      $('#somediv2').hide();
      $('#somediv1').show();
    });
  </script>
  <script> //this include mathjax from mathjax cdn
  </script>
</body>

Now, the problem:

When the page first loads, the text in somediv1 gets formatted by Mathjax. However when i click on any of the buttons the div elements hide and when they are shown aganin they do not get formatted, as Mathjax gets applied only once. How can i keep the Mathjax applied to the LATEX text inside these div elements.

UPDATE: The text inside somediv elements is not normal LATEX text but highly formatted (Read a lots of HTML tags included). And, I wish to keep it that way.

Was it helpful?

Solution

Got the answer!

I used MathJax.Hub.Queue(["Typeset",MathJax.Hub]); at every click event.

Its working perfectly.

References:

http://docs.mathjax.org/en/v1.1-latest/typeset.html

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top