Unable to fetch tab id from sub tab in Jquery

Unable to fetch tab id from sub tab in Jquery

I am using a tab structure as below:
<div id="tabs">
<ul>
<li><a href="#dia_details">Details</a></li>
<li><a href="#tab_raise_req">Raise Req</a></li>
</ul>
<div id="dia_details">
<div id="sub_tabs">
<ul>
<li><a href="#DIA_details">DIA Details</a></li>
<li><a href="#allocate_ba">Allocate BA</a></li>
</ul>
<div id="DIA_details>
<form>
--Code--
</form>
</div>
<div id="allocate_ba">
<form>
--Code--
</form>
</div>
</div>
</div>
<div id="tab_raise_req">
<form>
--Code--
</form>
</div>
When I am in a sub tab and want to save the particular tab for which I
have defined a button, I wanted to obtain the tab id of the currently
active tab.....which is one of the sub tabs.
For this I was using the below function in Jquery:
// Save Changes button click
$("#save_changes_id").click(function() {
// To retrieve the current TAB and assign it to a variable ...
var curTab = $('.ui-tabs-active');
var curTabPanelId = curTab.find("a").attr("href");
responseData = doAjaxCall($(curTabPanelId + " form"));
if(responseData == 1)
showMessage('status_msg', 'Project details updated successfully',
'green');
else
showMessage('status_msg', 'Error: Please check all the fields',
'red');
});
Here the function is returning the id of the parent tab instead of the sub
tab. I tried using addClass and removeClass but of no use.
Please suggest a solution for this. Thanking you in advance.