<!doctype html>
<html>
  <head>
    <title>form dynamic</title>
    <meta charset="utf-8"/>
    <script>
      function test()
      {
        for (var i = 1; i <= 6; i++) {
          var row = document.getElementById("row" + i);
          var x = document.getElementById("x" + i);
          x.parentNode.removeChild(x);
          row.insertBefore(x, row.firstElementChild);
        }
      }
    </script>
  </head>
  <body onload="test()">
    
    <!-- This test verifies that the form of the operators (and thus their spacing) is updated when you change the child list. -->
    <!-- The test should render the same as the static reference -->

    _<math><merror id="row1"><mo>+</mo><mi>y</mi></merror></math>_
    _<math id="row2"><mo>+</mo><mi>y</mi></math>_
    _<math><mphantom id="row3"><mo>+</mo><mi>y</mi></mphantom></math>_
    _<math><mrow id="row4"><mo>+</mo><mi>y</mi></mrow></math>_
    _<math><msqrt id="row5"><mo>+</mo><mi>y</mi></msqrt></math>_
    _<math><mstyle id="row6"><mo>+</mo><mi>y</mi></mstyle></math>_

    _<math><merror><mi id="x1">x</mi><mo>−</mo><mi>y</mi></merror></math>_
    _<math><mi id="x2">x</mi><mo>−</mo><mi>y</mi></math>_
    _<math><mphantom><mi id="x3">x</mi><mo>−</mo><mi>y</mi></mphantom></math>_
    _<math><mrow><mi id="x4">x</mi><mo>−</mo><mi>y</mi></mrow></math>_
    _<math><msqrt><mi id="x5">x</mi><mo>−</mo><mi>y</mi></msqrt></math>_
    _<math><mstyle><mi id="x6">x</mi><mo>−</mo><mi>y</mi></mstyle></math>_
    
  </body>
</html>