How to add controls dynamically in aspx page using jquery?

See more:

jQuery

I have a registration page,I want to add multiple controls on clicking means if any one clicking two times on add details button every controls i am using in my page should appear as number of click on add button.

following is my aspx code please help me using jquery or c#.....jquery would be higly appereciable

<div class="Client-Registration" id="Client-Registration">

     
       
         <h1 style="text-align:center">CLIENT CONTACT PERSON DETAILS</h1>
     </div>

     <div style="height:50; width:600px; margin-top:50px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
        <div style="float:left; width:200px">
            <asp:Label ID="lblContactPer" runat="server" Text="Contact Person"></asp:Label>
        </div>
        <div style="float:left; width:400px">
            <asp:TextBox ID="txtContactPerson" ToolTip="Contact Person" runat="server" Width="380px" Height="30px"></asp:TextBox>
        </div>
     </div>
      <div style="height:50; width:600px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
        <div style="float:left; width:200px">
            <asp:Label ID="lblDegignation" runat="server" Text="Designation"></asp:Label>
        </div>
        <div style="float:left; width:400px">
            <asp:TextBox ID="txtDesignation" ToolTip="Degignation" runat="server" Width="380px" Height="30px"></asp:TextBox>
        </div>
     </div>
      <div style="height:50; width:600px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
        <div style="float:left; width:200px">
            <asp:Label ID="lblPan" runat="server" Text="PAN NO."></asp:Label>
        </div>
        <div style="float:left; width:400px">
            <asp:TextBox ID="txtPaNO" runat="server" ToolTip="Client PAN no" Width="380px" Height="30px"></asp:TextBox>
        </div>
     </div>
      <div style="height:50; width:600px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
        <div style="float:left; width:200px">
            <asp:Label ID="lblEmailId" runat="server" Text="Email ID"></asp:Label>
        </div>
        <div style="float:left; width:400px">
            <asp:TextBox ID="txtConEmail" runat="server" ToolTip="Contact Person Email" Width="380px" Height="30px"></asp:TextBox>
        </div>
     </div>
     <div style="height:50; width:600px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
        <div style="float:left; width:200px">
            <asp:Label ID="lblDob" runat="server" Text="DOB"></asp:Label>
        </div>
        <div style="float:left; width:400px">
            <asp:TextBox ID="txtDob" runat="server" ToolTip="Date Of Birth" Width="380px" Height="30px"></asp:TextBox>
        </div>
     </div>
      <div style="height:50; width:600px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
        <div style="float:left; width:200px">
            <asp:Label ID="txt" runat="server" Text="Contact No:1"></asp:Label>
        </div>
        <div style="float:left; width:400px">
            <asp:TextBox ID="txtContact1" runat="server" ToolTip="ContactNo" Width="380px" Height="30px"></asp:TextBox>
        </div>
     </div>
     <div style="height:50; width:600px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
        <div style="float:left; width:200px">
            <asp:Label ID="lblContact2" runat="server" Text="Contact No:2"></asp:Label>
        </div>
        <div style="float:left; width:400px">
            <asp:TextBox ID="txtContact2" runat="server" ToolTip="ContactNo2" Width="380px" Height="30px"></asp:TextBox>
        </div>
     </div>
     <div style="height:50; width:600px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
        <div style="float:left; width:200px">
            <asp:Label ID="lblImageUpload" runat="server" Text="Image"></asp:Label>
        </div>
        <div style="float:left; width:400px">
            <asp:FileUpload ID="imageupload" ToolTip="Upload Image" runat="server" />
        </div>
     </div>

     <div style="height:50; width:600px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
        <div style="float:left; width:200px">
            <asp:Label ID="lblTeamManager" runat="server" Text="Team Manager"></asp:Label>
        </div>
        <div style="float:left; width:400px">
            <asp:DropDownList ID="ddlTM" runat="server">
            </asp:DropDownList>
        </div>
     </div>
     <div style="height:50; width:600px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
        <div style="float:left; width:200px">
            <asp:Label ID="lblExecutive" runat="server" Text="Executive"></asp:Label>
        </div>
        <div style="float:left; width:400px">
            <asp:DropDownList ID="ddlEcecutive" runat="server">
            </asp:DropDownList>
        </div>
     </div>
     <div style="height:50; width:600px; border-bottom:0px solid black; float:left; padding-top:20px;color:Blue">
         <div style="padding-left:200px">
         <asp:Button ID="btnSubmit" runat="server" Text="Submit" Width="100px"
                 onclick="btnSubmit_Click" />

         </div>

     </div>
  </div>