[Solved] Show Hide DIV on CheckBox Check (Selected) using JavaScript not working with ASP.Net master page

Sir, 

Its not doing anything. my full code is as below.

<asp:Content ID="Content2" ContentPlaceHolderID="cphBody" Runat="Server">
    <asp:UpdatePanel ID="upContent" runat="server">
        <ContentTemplate>
                        <section class="content">
                           <div class="row" id="divEntry" runat="server">
                            <div class="col-xs-12">
                                <table class="table table-bordered">
                                    <tr>
                                        <td>ID</td>
                                        <td colspan="3">
                                            <asp:TextBox ID="txtInvoiceID" runat="server" Width="100px" Enabled="false"></asp:TextBox>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>GST / Non-Gst</td>
                                        <td colspan="3">
                                            <label class="switch">
                                                <input type="checkbox" onclick="toggle(this)" runat="server" id="chkTest" />
                                                <span class="slider round"></span>
                                            </label>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                        <div runat="server" style="display: none;" id="cont">
                        <table class="table table-bordered">
                            <tr>
                                <td>ID</td>
                                <td colspan="3">
                                    <asp:TextBox ID="TextBox1" runat="server" Width="100px" Enabled="true"></asp:TextBox>
                                </td>
                            </tr>
                        </table>
                       </div>
                       </section>
        </ContentTemplate>
    </asp:UpdatePanel>
    <asp:UpdateProgress DisplayAfter="0" ID="MPG1" AssociatedUpdatePanelID="upContent" runat="server">
        <ProgressTemplate>
            <div id="overlay">
                <div id="modalprogress">
                    <div id="theprogress">
                        <img alt="indicator" src="Images/loading.gif" />
                        <br />
                        <br />
                        Please wait while system is updating ...
                    </div>
                </div>
            </div>
        </ProgressTemplate>
    </asp:UpdateProgress>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="cphBottom" Runat="Server">
    <script>
        function toggle(ele) {
            var cont = document.getElementById('cont');
            if (ele.checked) {
                cont.style.display = 'block';
            } else {
                cont.style.display = 'none';
            }
        }
</script>
</asp:content>