I've got a page with some global navigation that loads other pages into a content div using jQuery. The pages I'm loading into the div have jQuery UI tabs on them. I know how to load the pages into the div, but what I want to do is load the pages with a specific tab panel selected/open. Here's the html for my base page:

<nav> <a href="tabs.htm#tab-1">Link to Tab 1</a> <a href="tabs.htm#tab-2">Link to Tab 2</a> <a href="tabs.htm#tab-3">Link to Tab 3</a> </nav> <main></main> 

And the html for the tabs.htm page:

<div class="tabs nav-tabs"> <ul> <li><a href="#tab-1">Tab 1</a></li> <li><a href="#tab-2">Tab 2</a></li> <li><a href="#tab-3">Tab 3</a></li> </ul> <div id="tab-1">Blah</div> <div id="tab-2">Blah</div> <div id="tab-3">Blah</div> </div>

And my script:

$('nav a').click(function(e){ e.preventDefault(); $('main').load(this.href, function() { });

Is this possible?