Cannot get simple dialog to work

Cannot get simple dialog to work

I cannot get this simple dialog to display as a dialog.  When clicking the link, I'm taken to a page, but the page is not in a dialog.  Does anyone know how to resolve this?

<!DOCTYPE html>
<html>
  <head>
  <title>Open Dialog Test</title>
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" />
  <script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
  <script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>
</head>
<body>

<div data-role="page" id="home">

  <div data-role="header">
    <h1>Home</h1>
  </div>

  <div data-role="content">
    <p><a href="#dialog" data-rel="dialog">Open Dialog</a></p>   
  </div>

</div>

<div data-role="page" id="dialog">

  <div data-role="header">
    <h1>Dialog</h1>
  </div>

  <div data-role="content">
    <p>Dialog content goes here</p>   
  </div>

</div>

</body>
</html>