Javascript issue

See more:

C#

ASP.NET

Hi,
Please see the following senario

<asp:ScriptManager ID="TestScriptManager" runat="server" EnableScriptGlobalization="True">
   </asp:ScriptManager>
   <asp:UpdatePanel ID="UpdatePanel1" runat="server">
       <ContentTemplate>
           <div id="div1" runat="server">
               <script type="text/javascript">
                   //<!--
                   function fun1() {
                       alert('div1');
                   }
                   fun1();
                   //-->
               </script>
               Div1
               <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
           </div>
       </ContentTemplate>
   </asp:UpdatePanel>
   <asp:UpdatePanel ID="UpdatePanel2" runat="server">
       <ContentTemplate>
           <div id="div2" runat="server">
               <script type="text/javascript">
                   //<!--
                   function fun2() {
                       alert('div2');
                   }
                   fun2();
                   //-->
               </script>
               Div2
               <asp:Button ID="Button2" runat="server" Text="Button" OnClick="Button2_Click" />
           </div>
       </ContentTemplate>
   </asp:UpdatePanel>

protected void Page_Load(object sender, EventArgs e)
       {
           if (!IsPostBack)
           {
               div1.Visible = true;
               div2.Visible = false;
           }
       }
       protected void Button1_Click(object sender, EventArgs e)
       {
           div2.Visible = true;
           div1.Visible = false;
       }
       protected void Button2_Click(object sender, EventArgs e)
       {
           div1.Visible = true;
           div2.Visible = false;
       }

While loading the page, the first JavaScript will work and showing the alert message.
But while clicking the button1, second JavaScript is not working.