<!DOCYPE html>
<html>
<head>
<title>jqery goes to dom-ville</title>
<style>
#change_me{
position:absolute;
top:100px;
left:400px:
font:24px arial;}
#move_up #move_down #color #disappear
{
padding: 5px;}
</style>
<script src="scripts/jquery-1.6.2.min.js"></script>
</head>
<body>
<button id="move_up">move up</button>
<button id="move_down">move down</button>
<button id="color">color</button>
<button id="disappear">disappear/re_appear</button>
<div id="change_me">make me to stuff</div>
<script>
$(document).ready(functio(){
$("#move_up").ready(function(){
$("#change_me").animate({top:30},200);});
$("#move_down").ready(function(){
$("#change_me").animate({top:500},2000);});
$("#color").click(function(){
$("#change_me").css("color","purple");});
$("#disappear"),click(function(){
$("#change_me").toggle("slow");});
});
</script></body></html>