New to this js and jQuery gig (just started learning today) and think I've done something wrong - my js isn't working.

Code:
var y = document.getElementById("advanced").checked;
if (y == true){
$(function(){
 
    $("#advanced").click(function () {
      $("#searchTools").show("blind", { direction: "vertical" }, 700);
});
 
  });
}
else {
$(function(){
   
$("#advanced").click(function () {
      $("#searchTools").hide("blind", { direction: "vertical" }, 700);
});
 
  });
}
The html that goes with it:
HTML Code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MusicBrainz!</title>
<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>
<script src="http://dev.jquery.com/view/tags/ui/latest/ui/effects.core.js"></script>
<script src="http://dev.jquery.com/view/tags/ui/latest/ui/effects.blind.js"></script>
<script type="text/javascript" src="js/divgrow.js"></script>
 
<style type="css/text">
#seachTools {
        display: none;
    height: 220px;
    width: 450px;
    overflow: hidden;
    display: none;
}
</head>
 
<body>
<div id="searchTools">
<label title="Search For">Search For: </label>
<input name="search2" type="text" size="50" maxlength="256" border="0" class="searchInput" />
</div>
<div id="inputWrap">
<label>
<input type="checkbox" id="advanced" />
</label>
<label>Advanced Search Options</label>
Basically when a checkbox is checked, I want the div "#searchTools" to grow using jQuery; and when it's unchecked I want it to shrink.

Any ideas where I went wrong?