How to: typeset inline equations before display equations

Here is a configuration block that will reorder the equations so that the inline equations are done first.

<script type="text/x-mathjax-config">
MathJax.Hub.Register.StartupHook("HTML-CSS Jax Ready",function () {
  var HTMLCSS = MathJax.OutputJax["HTML-CSS"];
  HTMLCSS.Augment({
    OldPreTranslate: HTMLCSS.preTranslate,  // cache original preTranslate
    //
    //  Call original preTranslate (sets the HTMLCSS.display values used below)
    //  Then separate the scripts into inline and display ones
    //  Finally, make the scripts be inline followed by the display
    //
    preTranslate: function (state) {
      this.OldPreTranslate(state);
      var scripts = state.scripts, inline = [], display = [];
      for (var i = 0, m = scripts.length; i < m; i++) {
        (scripts[i].MathJax.elementJax.HTMLCSS.display ? display : inline).push(scripts[i]);
      }
      state.scripts = inline.concat(display);
    }
  })
});
MathJax.Hub.Register.MessageHook("New Math",function (message) {console.log(message[1])});
</script>

A console message at the bottom will let you see that the equations are processed in the right order. (The element numbers are in the order in the file, so if they are not in numeric sequence, you can see that they are being done inline first then display.)