The big problem that I had was writing expressions in LaTeX is not a skill I have, so although the simpler expressions were easy (for example:
P_N = P_0(1+i)^N becomes \(P_N = P_0(1+i)^N\)), by the time I was writing the second installment the expressions I wanted to write in LaTeX were getting very hairy.
First of all I wrote a small HTML page that had a div to display the rendered expression, a paragraph to do the same (MathJax will display its results in a block or an inline element), and then a textarea for me to type the LaTeX expression:
The relevant elements are styled to appear in the center of the page (that’s the default for MathJax rendering in a block element). Notice also I’m loading jQuery and MathJax.
Next the code, which I added before the closing tag for the body element:
It’s written as a jQuery document.ready function. In it I save the jQuery objects for the input textarea and both named output elements and then I add a keyup handler to the input textarea. On every keystroke, I grab the current contents of the input box, format it as an expression for both the block and inline elements, and then ask MathJax to re-render (that is, typeset) both elements. (MathJax queues up the requests and executes them asynchronously.) Bingo!
Here is is in action, finishing off writing out the quadratic formula I’m sure you remember from school:
Once I like how a particular expression looks, I can copy the content of the textarea and paste it into the blog post.
So, if you ever find yourself writing posts that need mathematical expressions, there you go. Have at it.