Jquery inside a post

Hi all,

I’m trying to get a simple jquery image swap working in one of my posts. Basically when you click on a different color, the picture is shown in that color. I got the plug in working offline on my desktop, but implementing it into WordPress seems to be breaking it. I’ve checked if WordPress is detecting the jquery library, and it is. Below is the code inside my post for reference..

<script type="text/javascipt">
$(document).ready(function(){

 $("a.swap1").click(function(){
   $("img.img-swap").attr("src", "http://konggraphics.com/mano/wp-content/uploads/2012/01/MP1601BK.png");
 });

 $("a.swap2").click(function(){
   $("img.img-swap").attr("src", "http://konggraphics.com/mano/wp-content/uploads/2012/01/MP1601NA.png");
 });

 $("a.swap3").click(function(){
   $("img.img-swap").attr("src", "http://konggraphics.com/mano/wp-content/uploads/2012/01/MP1601RW.png");
 });

});

</script>

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar("bongos") ) : ?>
<?php endif; ?>

<div class="left">

<h1>C1601</h1>

<p>Double Conga Set 10” & 11” with Stand </p>

<ul>
<li><strong>Colours:</strong></li>
<li><a class="swap1" href="#">-BK (Black Wood)</a></li>
<li><a class="swap2" href="#">-NA (Natural)</a></li>
<li><a class="swap3" href="#">-RW (Red Wood)</a></li>
</ul>

</div>

<div class="right">
<img class="img-swap" src="http://konggraphics.com/mano/wp-content/uploads/2012/01/MP1601BK.png" alt="Mano Conga" />

</div>

I have the phpexec plug in running, the widgets are working perfectly. It’s only the Jquery that doesn’t seem to be working.

Thanks for you help!