Nested Tab call function on tab select help

[J Wolfe]

I'm fairly new to jQuery and don't understand exactly why this isn't
working. I bind the tabsselect to one of my nested tabs hoping it will
execute that function, though I do not get any errors with firebug and
it doesn't work. Can anyone clue me into what I'm doing wrong? Thanks!

Jonathan


######## script portion: ########

$(function () {
// Make main set of tabs
$('#tabs').tabs({
fx: {
opacity: 'toggle'
}
});


$('#nested-tabs').tabs({
fx: {
opacity: 'toggle'
}
});

$('#nested-tab-1').bind('tabsselect', function(event, ui){
alert("Tab was pressed");
});
});



############# html portion ###############


<div id="tabs-4" class="ui-tabs-hide">
<div id="nested-tabs" class="ui-tabs">
<ul>
<li><a href="#nested-tab-1">Radar</a></li>
<li><a href="#nested-tab-2">Satellite</a></li>
</ul>
<div id="nested-tab-1"><img src = "http://radar.weather.gov/
ridge/lite/N0R/RTX_loop.gif"</div>
<div id="nested-tab-2"><img src = "http://radar.weather.gov/
ridge/lite/N0R/RTX_loop.gif"</div>

</div>
</div><!-- End tabs-4 -->