Accordion inside another accordion - accordion

Question

Iam using ajax accordion. Is it possible to add an ajax accordion inside another accordion.
I tried adding this, but the accordion inside is not loading(not getting displayed)
<ajax:Accordion ID="accordionCountry" HeaderCssClass="headerStyle marginUpDown" HeaderSelectedCssClass="headerSelectedStyle" ContentCssClass="contentBackground" runat="server" SelectedIndex="-1" FadeTransitions="true" SuppressHeaderPostbacks="true" TransitionDuration="250" FramesPerSecond="40" RequireOpenedPane="false" AutoSize="None">
<HeaderTemplate>
<asp:Panel ID="pnlShowCategory" runat="server" CssClass="cursorPointer categoryPanelBackground marginUpDown">
<table cellpadding="0" cellspacing="0" width="98%">
<tr>
<td align="left">
<asp:Label ID="lblCategoryName" runat="server" Text='<%# Eval("CategoryName") %>'
CssClass="paddingLeft"></asp:Label>
</td>
<td align="right">
<asp:Image ID="Image3" runat="server" ImageAlign="Right" Height="20px" CssClass="verticalAlignMiddle" />
<asp:HiddenField ID="hdnCategoryId" runat="server" Value='<%# Eval("CategoryId") %>' />
</td>
</tr>
</table>
</asp:Panel>
</HeaderTemplate>
<ContentTemplate>
<ajax:Accordion ID="accordionCountry1" HeaderCssClass="headerStyle marginUpDown" HeaderSelectedCssClass="headerSelectedStyle"
ContentCssClass="contentBackground" runat="server" SelectedIndex="-1" FadeTransitions="true"
SuppressHeaderPostbacks="true" TransitionDuration="250" FramesPerSecond="40"
RequireOpenedPane="false" AutoSize="None">
<HeaderTemplate>
</HeaderTemplate>
<ContentTemplate>
<asp:Panel ID="pnl" runat="server" CssClass="cursorPointer categoryPanelBackground marginUpDown">
<table cellpadding="0" cellspacing="0" width="98%">
<tr>
<td align="left">
<asp:Label ID="lblSubCategoryName" runat="server" Text='<%# Eval("SubCategoryName") %>'
CssClass="paddingLeft"></asp:Label>
</td>
<td align="right">
<asp:Image ID="Image3" runat="server" ImageAlign="Right" Height="20px" CssClass="verticalAlignMiddle" />
</td>
</tr>
</table>
</asp:Panel>
</ContentTemplate>
</ajax:Accordion>
</ContentTemplate>
</ajax:Accordion>

Answer 1

try to use jQuery for accordion, it's better, check below link out :
click run after you click the link below
(function($) {
var allPanels = $('.accordion .dd').hide();
$('.accordion .dt a').click(function() {
allPanels.slideUp();
$(this).parent().next().slideDown();
return false;
});
})(jQuery);
Check This