Can someone tell me what I'm doing wrong?

Can someone tell me what I'm doing wrong?

Admittedly, I am not a jQuery expert.  I am trying to use a simple slide animation in Firefox using Ubuntu 10.04.  I want one div to disappear and then another div to slide in from the right or left.  This is the code I'm using:


   $('a#words').click(function() {
     $('div#spacer').hide().end()
       $('div.options').show("slide", { direction: 'left' },  500)
       return false;
   });








These are the script tags I'm using in my header:

<script type="text/javascript" src="scripts/jquery.effects.core.js"></script>
<script type="text/javascript" src="scripts/jquery.effects.slide.js"></script>

I have also used these (in combination with the above) just for extra luck:

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

This is the webpage on which it is being implemented.  Simply click the "words" link to test it:  www.freewebs.com/edauenhauer


I am sure something I'm doing is a dumb mistake, but I just want it to animate.  Currently, my first div disappears and then my second div just appears after a short break without any animation.  Thank you for your time.