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 -->