Reputation: 1398
I am trying to insert a script on a click or after setting some time out, (as shown below) and it does not append. However, if I remove the setTimeout function it does append. Same occurs with on click or any other event. Can somebody tell me why, and how I can accomplish this?
setTimeout(function(){
var parent = $('#panel');
var element = $('<div></div>');
var script = document.createElement('script');
script.setAttribute('type','math/tex');
script.textContent = 'e^{\\pi i} + 1 = 0';
element.append(script);
parent.append(element);
}, 1500);
Upvotes: 1
Views: 71
Reputation: 13419
edit: if you're using MathJax, you need to tell MathJax to rescan the page for new latex tags after inserting this one after 1.5 seconds, see http://docs.mathjax.org/en/latest/typeset.html usually you can get away with just running MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
which for you would mean:
setTimeout(function(){
var parent = $('#panel');
var element = $('<div></div>');
var script = document.createElement('script');
script.setAttribute('type','math/tex');
script.textContent = 'e^{\\pi i} + 1 = 0';
element.append(script);
parent.append(element);
MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
}, 1500);
original answer: it works here in my jsfiddle:
https://jsfiddle.net/aLe0jL3y/
I suspect you believe that once you append this script tag, that your latex library will automatically detect that it was inserted and parse it or something.
I don't know which library you're using for latex, but I'm guessing that your code works outside of the setTimeout because then it's being inserted before the latex library scans the page for math/tex script tags, whereas when you use a 1.5 second delay, the library would have already run, and so your script tag is being inserted but you don't see it because the latex library already ran by this point in time so it's not going to parse it.
I suggest making sure that the latex library uses is running after 1.5 seconds.
Upvotes: 2