[jQuery] 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 -->