Expand /collapse ASP.NET AJAX CollapsiblePanel programmatically using JavaScript

In Default.aspx



  <style type="text/css">
        .cpHeader
        {
            color: white;
            background-color: #719DDB;
            font: bold 11px auto "Trebuchet MS" , Verdana;
            font-size: 12px;
            cursor: pointer;
            width: 450px;
            height: 18px;
            padding: 4px;
        }
        .cpBody
        {
            background-color: #DCE4F9;
            font: normal 11px auto Verdana, Arial;
            border: 1px gray;
            width: 450px;
            padding: 4px;
            padding-top: 7px;
        }
    </style>

    <script type="text/javascript">

        function ExpandCollapse() {
            var collPanel = $find("CollapsiblePanelExtender1");
            if (collPanel.get_Collapsed())
                collPanel.set_Collapsed(false);
            else
                collPanel.set_Collapsed(true);
        }    

    </script>


<form id="form1" runat="server">
    <div>
  <cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
  </cc1:ToolkitScriptManager>
    <div>
   

  <asp:Panel ID="pHeader" runat="server" CssClass="cpHeader">

        <asp:Label ID="lblText" runat="server" />
  </asp:Panel>
  <asp:Panel ID="pBody" runat="server" CssClass="cpBody">
             This is Collapsible extender,using javascript
  </asp:Panel>
  <asp:Button ID="btnClick" OnClientClick="ExpandCollapse()" runat="server" Text="Expand/Collapse" />
           
  <cc1:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server" TargetControlID="pBody"
CollapseControlID="pHeader" ExpandControlID="pHeader" Collapsed="true" TextLabelID="lblText" ExpandedSize="120"
CollapsedText="Click to Show Content.." ExpandedText="Click to Hide Content.."

 CollapsedSize="0">

  </cc1:CollapsiblePanelExtender>
    
        </div>
       
    </div>
    </form>