change tab container when button click

See more:

ASP.NET

CSS

HTML

I have one user detail page in which i create three tabs : Details, image change and delete image. To prevent 3 separate pages for each so i created tab like structure.

<ul id="tabs"> 
<li><a href="#tab1">Veiw/Edit Profile</a></li> 
<li><a href="#tab2">Change image</a></li>
<li><a href="#tab3">Delete image</a></li>
</ul>
<div class="container" id="tab1">
</div>

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div class="container" id="tab2">
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="btn_upload1" runat="server" Text="Update" onclick="btn_upload1_Click" />
</div>
</ContentTemplate>
<triggers>
<asp:PostBackTrigger ControlID="btn_upload1"/>
</triggers>
</asp:UpdatePanel>

<div class="container" id="tab3">
</div>

Problem is : when i am changing image from tab 2 and click button it does'nt remains on same tab after change image, it comes to tab1 and even after apply update panel it refresh the page.