Keep the selected jQuery tab active on partial post back in asp.net

I have spent quite some time to figure out how to stay in the same tab when partial post back occurs in asp.net application. By default it always go back the first tab. Here is what I have done to return to selected tab after partial or Asynchronous post back.

<link href="themes/redmond/ui.all.css" rel="stylesheet" type="text/css" />
    <script src="Scripts/jquery.tools.min.js" type="text/javascript"></script>
    <script src="Scripts/ui.core.js" type="text/javascript"></script>
    <script src="Scripts/ui.tabs.js" type="text/javascript"></script>

<script type="text/javascript">
        var selTab;
        $(function () {
            var tabs = $("#tabs").tabs({
                show: function () {
                    //get the selected tab index
                    selTab = $('#tabs').tabs('option', 'selected');                   
                }
            });

        }); ;

    </script>

In the above javascript I am setting the tab on initial page load and set the selected tab value to selTab.

No it works fine for full post back however it will not work on partial post back when I use the tabs inside the updatePanel. So to set the tab and get the selected tab value I have created another function on partial page load. Here is the additional function.

<script type="text/javascript">
        var selTab;
        $(function () {
            var tabs = $("#tabs").tabs({
                show: function () {
                    //get the selected tab index
                    selTab = $('#tabs').tabs('option', 'selected');

                }
            });

        }); ;

    function pageLoad(sender, args) {

        if (args.get_isPartialLoad()) {

            $("#tabs").tabs({show: function () {
                    //get the selected tab index on partial postback
                    selTab = $('#tabs').tabs('option', 'selected');

                }, selected: selTab  });

        }
    };

    </script>

HTML code for the tab set –

<asp:UpdatePanel runat="server">
<ContentTemplate>

  <asp:UpdateProgress ID="UpdateProgress1" runat="server">
    <ProgressTemplate>
        <img src="images/uploading.gif" alt="Loading..." />
    </ProgressTemplate>
    </asp:UpdateProgress>
	 <asp:Button ID="btnPublish"
        runat="server" Text="Publish" OnClick="btnPublish_Click" CssClass="button" />
	<div id="tabs">
	<ul id="none">
		<li><a href="#tabs-1">Asset details</a></li>
		<li><a href="#tabs-2">Structure details</a></li>
		<li><a href="#tabs-4">Audit Info</a></li>
	</ul>

<div id="tabs-1">

<p>Tab one content</p>
</div>
<div id="tabs-1">

<p>Tab one content</p>
</div>
<div id="tabs-1">

<p>Tab one content</p>
</div>
</div>

    </ContentTemplate>
    </asp:UpdatePanel>

In the above example I did not use any hidden item to set the current tab value.

Happy programming.