Skip to content

Instantly share code, notes, and snippets.

@pkra
Created December 27, 2012 17:12
Show Gist options
  • Save pkra/4390002 to your computer and use it in GitHub Desktop.
Save pkra/4390002 to your computer and use it in GitHub Desktop.
Render Mathjax Formula in a dynamically rendered element From the MathJax User Group, https://groups.google.com/d/topic/mathjax-users/GlN4tppMxyA/discussion
<html>
<head>
<title>Interactive MathML display</title>
<script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js">
MathJax.Hub.Config({
extensions: ["mml2jax.js"],
jax: ["input/MathML", "output/HTML-CSS"]
});
</script>
</head>
<body>
<script>
window.onload = function()
{
var parent = document.getElementById("thisdiv");
parent.innerHTML = "<div id=\"thisdivchild\" onclick=\"dothis(\'thisdivchild\')\">hello click here.</div>";
}
window.dothis = function (element) {
if (typeof(element) === "string") {element = document.getElementById(element)}
element.innerHTML = '<math><mi>x</mi><mo>=</mo><mrow><mfrac><mrow><mo>&#x2212;</mo><mi>b</mi><mo>&#x00B1;</mo><msqrt><msup><mi>b</mi><mn>2</mn></msup><mo>&#x2212;</mo><mn>4</mn><mi></mi><mi></mi></msqrt></mrow><mrow> <mn>2</mn><mi>a</mi> </mrow></mfrac></mrow><mtext>.</mtext></math>';
MathJax.Hub.Queue(["Typeset",MathJax.Hub,element]);
}
</script>
<p>
<div id="MathOutput">
Formula: <math></math>
</div>
<div id="thisdiv"></div>
</body>
</html> ​
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment