How to use jquery correctly in SharePoint Web Part - jquery doesn't always fire

Question

I'm learning how to use jquery with SharePoint. My example draws a red box inside the Content Editor Web Part when a link is selected. My code works when the SharePoint page is in edit mode but not after I've left the page and returned in non edit mode. The jquery function does not fire for some reason... I'm missing something simple but not sure what.

Thanks for any help.

Kevin

My master page for the site connects to the jquery-1.3.2.min.js file this way:

 <SharePoint:ScriptLink language="javascript" name="jquery-1.3.2.min.js" 
 Defer="true" runat="server"/>

My Content Editor Web Part code looks like this:

<style type="text/css">
#box
{
    background: red;
    width: 300px;
    height: 300px;
    display: none;
}
</style>


<script type ="text/javascript">
    $(function() {
        $('a').click(function() {
            $('#box').slideDown(2000);
        });
    })
</script>

<div id="box">
<h1>This is text in the box</h1>
</div>
<a href="#">Display Box</a><br />

Answer 1

Recently I have encountered with a problem I think it might help someone.

In SharePoint head tag if you place the script tag like

<script language="javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"/>

then jQuery is not working but if you place like

<script language="javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>

See the </script> difference then it's working.

I am surprised!