Mathematical Notations - is it not working?

The Problem

I found out that when adding even a single line to the index.html.

  <p>testing</p>

and then insert { { content } } into the _layout/home.html, the mathematical notations would be partly broken and won’t render correctly. It’s noticed that even the same behaviour can be observed from the theme demo itself

Here is a screenshot from iPhone

And here is another screenshot from my desktop, notice some errors?

The Solution

I found a workaround. Instead of adding html elements directly into the index.html, I created an _includes/greeting.html file, then simply insert it into the _layouts/home.html using flow control { % include greeting.html % }.

So far, it hasn’t broken the MathJax syntax yet, so I am hopeful.