Html comment breaking the website

Question

I was getting a "Failed to execute 'insertBefore' on 'Node'" error after clicking a link to another page:

<template name="reminderPage">
    <a href="/newRemind">New!</a>
    {{>reminder}}
    <!-- Random comment -->
</template>

<template name="reminder" class="reminder">
      <p>Hello reminder</p>
        {{>editForm}}
</template>

<template name="editForm">
    <div id="dialog-form" title="Edit Reminder">
      <p class="validateTips">All form fields are required.</p>
      <form>
        <fieldset>
          <label for="taskf-name">Name</label>
          <input type="text" name="taskf-name" id="taskf-name" maxlength="20">
          <label>Bought</label>
          <input type="text" name="taskf-bought" id="taskf-bought">
          <label>Expire</label>
          <input type="text" name="taskf-expire" id="taskf-expire">
        </fieldset>
      </form>
    </div>
</template>

Apparently, that little comment was interfering with the code because after I deleted it, everything worked perfectly.

While problem was fixed, I would really like to know how could this line be getting in the way of the code.

Does anyone know why? I was using Meteor with Iron-Router.

Thank you!

EDIT

If it helps, I am using Jquery-UI and this was my javascript file

Template.reminder.rendered = function () {

  $( "#dialog-form" ).dialog({
    autoOpen: false,
    modal: true,
    open: function () {
    },
    buttons: [
        {
          id: "button-ok",
          text: "Save",
          click: function() {
              $(this).dialog("close");
          }
        },
        {
          id: "button-cancel",
          text: "Cancel",
          click: function() {
              $(this).dialog("close");
          }
        }
    ]
  });

}

The "newRemind" page just has the most basic dialog, and it's js file just initiates it.

<template name="newRemindPage">
    <div id="dialog" title="Basic dialog">
      <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
    </div>
</template>

Javascript:

Template.newRemindPage.rendered = function () {
  $( "#dialog" ).dialog();
};

Answer 1

Per Spacebars documentation on comments :

{{! Comments can be one line}}

{{!
  Or they can be
  multi-line
}}

{{!-- They can also be written like this --}}

Please post your updated code if it doesn't work after trying this.