Where is the problem

Where is the problem


My code is:
<!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" xml:lang="en" lang="en">
<head>
    <title>jQuery UI - Functional demos</title>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="jquery,user
interface,ui,widgets,interaction,javascript" />
    <meta name="description" content="jQuery UI is jQuery's user
interface library that comes with many widgets, interaction modules
and themes." />
    <meta name="author" content="Paul Bakaus" />
            <link rel="stylesheet" href="../themes/default/ui.all.css"
type="text/css">
            <script src="../jquery-1.2.6.js" type="text/javascript"></script>
<script src="../ui/jquery.ui.all.js" type="text/javascript"></
script>
            <script type="text/javascript">
            $(function() {
                $("#apa").bind('click', function() {
                $('#dock').dialog({
buttons: {
'Okay': function() {
$('#dock').dialog('close');
}
},
overlay: {
backgroundColor: '#000',
opacity: 0.5
},
modal : true,
title:"incercare de rrrr",
autoResize : true
});
});
            });
            </script>
    </head>
<body>
<button id="apa">Apasa</button>
<div id="dock" style="display:none">
            <div class="left"></div>
            <ul>
                <li>
                    <a href="http://jquery.com">jQuery</a>
                </li>
                <li style="padding-right: 12px;">
                    <a href="http://plugins.jquery.com/">Plugins</a>
                </li>
                <li class="selected" style="padding-right: 12px;">
                    <a href="http://ui.jquery.com/home">UI</a>
                </li>
                <li style="padding-left: 12px;">
                    <div style="background: #555; width: 1px; height: 24px; position:
absolute; left: 0px;"></div>
                    <a href="http://jquery.com/blog">Blog</a>
                </li>
                <li>
                    <a href="http://ui.jquery.com/about">About</a>
                </li>
                <li>
                    <a href="http://docs.jquery.com/Donate">Donate</a>
                </li>
            </ul>
            <div class="right"></div>
        </div>
</body>
</html>
When i click the button , first appear the dialog, but the content
doesn't appear, and the second time it doesn't work at all.