jQuery: Sliding elements up and down

Here is some text.

This is also text.

And here's some more text.

The jQuery Code START

    
    <script type="text/javascript" src="./jquery-1.5.1.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    
    <script type="text/javascript">
      function slideup() {
        $('#first').slideUp("slow");
      }
    </script>
    
    <style type="text/CSS">
        <!--
        .code { color: red; }
        .back { background-color: yellow; }
        
        .div1 { height:125px;
                width:243px;
                background-image: url(s.gif);
                background-repeat: repeat; }
        -->
   </style>
   
  </head>

  <body>
    <h1>jQuery: Sliding elements up</h1>
    <div class="div1">
      <p id="first">Here is some text.</p>
      <p>This is also text.</p>
      <p>And here's some more text.</p>
    </div>
  <form action="">
   <input type="button" value="Slide up" onclick="slideup()"></input>
  </form>