jQuery, how to clone back saved elements?
<p>To demonstrate, please see my html :</p>

<pre><code>&lt;html&gt;
&lt;head&gt;
&lt;script src="http://code.jquery.com/jquery-1.9.1.js"&gt;&lt;/script&gt;
&lt;/head&gt;
See it:
&lt;pre&gt;
print "Say hello"
&lt;/pre&gt;
&lt;p&gt;&lt;b&gt;==SEP==&lt;/b&gt;&lt;/p&gt;
&lt;pre&gt;
class Voila {
public:
  // Voila
  static const string VOILA = "Voila";

  // will not interfere with embedded &lt;a href="#voila1"&gt;tags&lt;/a&gt;.
}
&lt;/pre&gt;
&lt;/html&gt;
</code></pre>

<p>In Chrome v26 console, I execute:</p>

<pre><code>var pres_orig=$('pre').clone()
$('pre').replaceWith('&lt;pre&gt;spam&lt;/pre&gt;')
</code></pre>

<p><strong>Then my question: How to clone back the <code>&lt;pre&gt;</code> content from saved pres_orig so that my page displays its original content?</strong></p>

<p>I've tried the following which does not work:</p>

<pre><code>$('pre').replaceWith(pres_orig)
</code></pre>

<p><img src="http://i.stack.imgur.com/9yYVD.png" alt="enter image description here">
<img src="http://i.stack.imgur.com/MQuBh.png" alt="enter image description here"></p>
