I am trying to answer my own question. After delving into the guidelines of MathJax and Kramdown, and doing some experiments, I found the problem, and it is not related to kramdown.
The problem is caused by the ampersand character: &
. In LaTeX, it is valid to write an ampersand character, except when inside special environments, and it will be rendered correctly. However, as in markdown blogs, the source code is processed by browsers before math renderers, so the &
character is misinterpreted, causing it not correctly read by MathJax. I mostly use LaTeX in my life, so I thought a valid LaTeX expression should be a valid markdown math block as well and overlooked the issue special characters when I asked this question. The online MathJax renderers can render the bare &
correctly, probably because entered text are not first processed by the browser.
The solution is to escape the ampersand, i.e. write \&
, and for double insurance, surround it by white spaces, so the browser will treat it as a normal text.
Similar problems will occur to other characters that have special meanings in html, like <
and >
. The same solution applies, that the character has to be escaped or if that is not possible, expressed in other ways.