jQuery Tabs loading pages via Ajax

jQuery Tabs loading pages via Ajax

I have a small test project I am trying to get working....I have 5 tabs and each loads an external page via Ajax. My problem is that those external pages have javascript functionality that doesn't work once the page is loaded into the tab container.  If I copy and paste all of the code to the main (test.aspx) the hover functionality works...if I leave it on dashboard.aspx, when it's loaded into the tabs, no hover functionality exists...I'm sure I'm doing something silly, but can't figure it out...any help would be appreciated.

css
----------------------------------------
* {
  margin:0;
  padding:0;
  font-family: Tahoma, "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
}

 /* General Layout
________________________________*/
body {width:100%; background:#ffffff;}

#main {
  margin:0 auto;
  width:770px;
}

h2{font-size:14px;color:#369;padding:5px 5px 5px 5px;}

a{outline:none;}
a img {border: none;}

p.loading {font-weight:normal; font-style:italic;}
p.loading img {padding-right:5px;}

.subpanel {
left: 0;
border: 1px solid #f0f0f0;
border-top:none;
background: #fff;
overflow: hidden;
}
.subpanel { margin:0; padding:0; /*--Reset left positioning and make it right positioned--*/ }
.subpanel li {
border-top: 1px solid #f0f0f0;
border-bottom:1px solid transparent;
display: block;
}
.subpanel li p {padding: 10px;}
.subpanel li a.delete, .subpanel li a.edit {
background: url(../images/delete_x2.gif) no-repeat;
float: right;
width: 15px; 
height: 16px;
margin: 10px;
text-indent: -9999px;
visibility: hidden;
}
.subpanel li a.edit {background: url(../images/edit.gif) no-repeat;}
.subpanel li a.delete:hover, .subpanel li a.edit:hover { background-position: right bottom; }


test.aspx main page
----------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
    <link rel="shortcut icon" href="../images/favicon.ico"/>
    <link type="text/css" href="../css/default.css" rel="stylesheet" media="print, projection, screen"/>
    <link type="text/css" href="../css/ui.tabs.css" rel="stylesheet" media="print, projection, screen"/>
    <script type="text/javascript" src="../javascript/jquery-1.3.2.min.js" ></script>
    <script type="text/javascript" src="../javascript/jquery.preloadCSSImages.js" ></script>
    <script type="text/javascript" src="../javascript/ui.core.js"></script>
    <script type="text/javascript" src="../javascript/ui.tabs.js"></script>
    <script type="text/javascript" src="../javascript/jquery.cookies.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $.preloadCssImages();
            $('#container-8').tabs({
                spinner: '<p class="loading"><img src="../images/38-1.gif"/>loading...</p>'
            });
        });
    </script>
</head>
<body>
    <div id="main">    
        <h2>Quote</h2>
        <div id="container-8">
            <ul>
                <li><a href="dashboard.aspx" title="Dashboard"><span>one</span></a></li>
                <li><a href="quotes.aspx" title="Quotes"><span>two</span></a></li>
                <li><a href="policies.aspx" title="Policies"><span>three</span></a></li>
                <li><a href="claims.aspx" title="Claims"><span>four</span></a></li>
                <li><a href="reports.aspx" title="Reports"><span>five</span></a></li>
            </ul>
        </div>
    </div>
</body>
</html>

dashboard.aspx (external page)
------------------------- 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>dashboard</title>
    <link type="text/css" href="../css/default.css" rel="stylesheet" media="print, projection, screen"/>
    <script type="text/javascript" src="../javascript/jquery-1.3.2.min.js" ></script>
    <script type="text/javascript">   
        $(document).ready(function() {
            $(".subpanel li").hover(function() {
                $(this).find("a.delete").css({ 'visibility': 'visible' }); //Show delete icon on hover
            }, function() {
                $(this).find("a.delete").css({ 'visibility': 'hidden' }); //Hide delete icon on hover out
            });
    </script>
</head>
<body>
<div id="dashboard">
    <div class="subpanel">
        <ul>
            <li><a href="#" class="delete">X</a><p><a href="#">Item #1</a> abico quod duis odio tation luctus eu <a href="#">Item #1a</a>.</p></li>
            <li><a href="#" class="delete">X</a><p><a href="#">Item #2</a> Duis vel quis at metuo obruo, turpis  <a href="#">Item #1a</a>.</p></li>
            <li><a href="#" class="delete">X</a><p><a href="#">Item #3</a> nulla eum probo metuo nullus indoles  <a href="#">Item #1a</a>.</p></li>
            <li><a href="#" class="delete">X</a><p><a href="#">Item #4</a> abico quod duis odio tation luctus eu <a href="#">Item #1a</a>.</p></li>
            <li><a href="#" class="delete">X</a><p><a href="#">Item #5</a> nulla eum probo metuo nullus indoles  <a href="#">Item #1a</a>.</p></li>
            <li><a href="#" class="delete">X</a><p><a href="#">Item #6</a> minim autem aptent et jumentum metuo  <a href="#">Item #1a</a>.</p></li>
            <li><a href="#" class="delete">X</a><p><a href="#">Item #7</a> abico quod duis odio tation luctus eu <a href="#">Item #1a</a>.</p></li>
        </ul>
    </div>    
</div>
</body>
</html>