Creating a draggable division inside another div
===

I want to create a draggable div which is inside a bigger div.
This is my program. But Its not working.
I guess the draggable function is the one to use make a div draggable.
also which version I have to use? 1.7.2 or 1.3.2 ? 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>First jQuery-Enabled Page</title>
    <style type="text/css">
	#draggable{ background-color:blue; width: 150px; height: 150px; padding: 0.5em;}
    </style>
    <script type="text/javascript" src="jquery-ui-1.8.21.custom.min"></script>
    <script type="text/javascript">
        $(function () {

		$("#draggable").draggable();
		   }
	);

     </script>
    </head>

    <body>
    <div id="draggable">
    <p>hai</p>
    </div>
    </body>
    </html>
