title: How to replace one html element with another
body: <p>I'm trying to replace a form inside a div with jQuery, consider following html:</p>
  
  <pre><code>&lt;div&gt;
    &lt;form&gt;
      &lt;input type="text" value="some text here" id="friendship" class="not_friends"&gt;
    &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and following js code:</p>
  
  <pre><code>div = $("#friendship.not_friends").parent().parent();
  $("form", div).remove();
  $(div).add(response);
  </code></pre>
  
  <p>the "form" element is removed, as I want, but the new form (in 'response' string) isn't added to div, why ?
  and there's a better way to write this js code ? this looks not good for me.</p>