jQuery & replaceWith(): reloading page every other time
<p>This code reloads the entire page rather than simply replacing the <code>#form</code> element every other time. Can someone suggest a fix so that only <code>#form</code> is replaced and the entire page not reloaded?</p>

<p>jQuery:</p>

<pre><code>  $("#login").submit(function() {
    $.post($(this).attr("action"), $(this).serialize(), function(html) {
        var htmlString = (new XMLSerializer()).serializeToString(html);
        $("#form").replaceWith(htmlString);
        $("html, body").animate({
          scrollTop: $("#message").offset().top
        }, 500);
    });
    return false;
  });
</code></pre>

<p>HTML:</p>

<pre><code>&lt;div id="form"&gt;
  &lt;form id="login" action="submit.php" method="post"&gt;
    &lt;input type="text" name="name"&gt;
    &lt;button type="submit"&gt;Submit&lt;/button&gt;
  &lt;/form&gt;
&lt;/div&gt;
</code></pre>

<p>It doesn't seem to me that replaceWith() would eliminate the bindings, but perhaps it does . . .</p>
