Cannot bring ID back to life using .replaceWith
<p>I'm trying to bring an ID from DOM back with a .replaceWith, even though I had already replaced it previously with a div containing an iframe first.</p>

<p>I know some will recommended toggle, or show, hide, but I'd rather not load each div on top of each other due to potential video on top of javascript slider at same time, which can get ugly for mobile browsing.</p>

<p>I'm using a click event for 'done' link which takes the user back to the javascript slideshow (slider-wrapper) where they began.</p>

<p>Cannot bring #slider-wrapper ID back from the dead after .replaceWith.</p>

<p>I've obviously tried:</p>

<pre><code>    $('a.back').live('click', function(evt) {
       slider = $('#slider-wrapper') 
        $('div.item-container').replaceWith(slider);
        evt.preventDefault();
</code></pre>

<p>..and many other tricks but it does not want to come back after the first .replaceWith</p>

<p>On a side note</p>

<p>safari does not 'hear' the second click event for .replaceWIth, firefox does though</p>

<p>Any help would be very much appreciated!</p>

<pre><code>$(window).load(function () {
    $('a.link').live('click', function(evt) {
        item = $('&lt;div class="item-container"&gt;&lt;iframe&gt;&lt;/iframe&gt;&lt;a class="back"&gt;Done&lt;/a&gt;&lt;/div&gt;');
        $('#slider-wrapper').replaceWith(item);
        evt.preventDefault();
    });

    $('a.back').live('click', function(evt) {

        $('div.item-container').replaceWith($('#slider-wrapper'));
        evt.preventDefault();       
    });
});
</code></pre>
