Trying to update the content of the #content div of a page by clicking a linked image in a jquery slideshow
<p>I'm really stumped on this one, although I am new to jquery. </p>

<p>I am trying to create a page where I have a slide show of products at the top and that by clicking on one of the products, the page would update the main #content div with a page from my server. I'm using the .load() function in order to get an ajax call to bring up the page. Additionally I'm using event.preventDefault() so that the click of the link doesn't change the page completely.</p>

<p>No clue what I'm doing wrong at this point. Any help would be greatly appreciated.</p>

<p>Also I've looked for other plugins to do what I'm trying to do, but with no success.</p>

<p>What I've done so far:</p>

<p>Code was pasted into this jsfiddle because stackoverflow kept complaining that I didn't have it formatted right. There is also css for the carousel but that seems to be working fine. I can include it if needed</p>

<p><a href="http://jsfiddle.net/WDXMU/1/" rel="nofollow">http://jsfiddle.net/WDXMU/1/</a></p>

<p><code>&lt;div id="wrap"&gt;</code></p>

<p><code>&lt;div id="mycarousel" class="jcarousel-skin-tango"&gt;</code></p>

<pre><code>&lt;ul&gt;
  &lt;li&gt;&lt;a href="page1.html"&gt;&lt;img src="img1.png"alt="" /&gt;&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="page2.html"&gt;&lt;img src="img2.png"alt="" /&gt;&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="page3.html"&gt;&lt;img src="img3.png"alt="" /&gt;&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="page4.html"&gt;&lt;img src="img4.png"alt="" /&gt;&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="page5.html"&gt;&lt;img src="img5.png"alt="" /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p><code>&lt;div class="jcarousel-scroll"&gt;</code>
<code>&lt;form action=""&gt;</code>
<code>&lt;a href="#" id="mycarousel-prev"&gt;&amp;laquo; Prev&lt;/a&gt;</code>
<code>&lt;a href="#" id="mycarousel-next"&gt;Next &amp;raquo;&lt;/a&gt;</code>
<code>&lt;/form&gt;</code>
<code>&lt;/div&gt;</code></p>

<p><code>&lt;/div&gt;</code>
<code>&lt;div id="content"&gt;</code>
<code>Show the content</code>
<code>&lt;/div&gt;</code></p>

<p><code>&lt;/div&gt;</code></p>

<p>The jquery code is in the fiddle because stack overflow didn't like it even with the escape character before and after</p>
