jQuery replaceWith not loading div properly
<p>I'm new to jQuery but am hoping to replace a <code>&lt;div&gt;</code> with another that contains a slideshow when I click on a link. The problem with my code however is that when I click the link, the <code>&lt;div&gt;</code> I want to load isn't showing. Instead I just see <code>div.slidesContainer</code> for example.</p>

<p>My HTML:</p>

<pre><code>&lt;div id="leftText"&gt;
  &lt;h2&gt;Heading.&lt;/h2&gt;
  &lt;p&gt;Text. &lt;a href="/" id ="startSlide" %&gt;'Learn more.'&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;div id="slide"&gt;
&lt;div class="slides_container"&gt;
  &lt;div&gt;
    &lt;h1&gt;Slide heading.&lt;/h1&gt;
      &lt;p&gt;Slide text.&lt;/p&gt;
  &lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>My jQuery:</p>

<pre><code>$(function(){
    $("a#startSlide").click(function(){
        $('div#leftText').replaceWith('div#slide');
        return false;
    });
});
</code></pre>

<p>Here's a jsFiddle if it'll help: <a href="http://jsfiddle.net/HR43b/" rel="nofollow">http://jsfiddle.net/HR43b/</a></p>
