将Jquery应用于XML标记

我有一个XML，在XSLT的帮助下，我为XML代码创建了手风琴应用风格

现在我正在尝试创建jqueryaccorbian

这是我的XML代码

<NavItem id="client1" ImageURL="/cs/PADEV/cache/AGL_NAV_COL_PERSON_21.GIF" Name="ADMN_F201312300957205437788018" SequenceNumber="3" Label="My Information"  TargetPortal="EMPLOYEE" Type="Folder" isVirtual="False">
<NavItem Label="Personal Information" Name="ADMN_S201312300957415580614642" SequenceNumber="4" isNewWindow="False" isTopWindow="True"/>
<NavItem Label="Mailing Address" Name="ADMN_S201312300957415580614642" SequenceNumber="4" isNewWindow="False" isTopWindow="True"/>
</NavItem>

<NavItem id="client2" ImageURL="/cs/PADEV/cache/AGL_NAV_COL_PERSON_21.GIF" Name="ADMN_F201312300957205437788018" SequenceNumber="3" Label="My Contact"  TargetPortal="EMPLOYEE" Type="Folder" isVirtual="False">
<NavItem Label="Phone" Name="ADMN_S201312300957415580614642" SequenceNumber="4" isNewWindow="False" isTopWindow="True"/>
<NavItem Label="Email" Name="ADMN_S201312300957415580614642" SequenceNumber="4" isNewWindow="False" isTopWindow="True"/>
</NavItem>

这是我的XSLT代码

<div id="accordian">
<xsl:if test="position() mod 5 = 0">
    <h3 title="{@Description}" id="check1">
        <!--<img src="{$imgSrc}" />-->
        <xsl:value-of select="@Label"/>
    </h3>
</xsl:if>

<xsl:if test="position() mod 5 = 1">
    <h3 title="{@Description}" id = "check2" >
        <!--<img src="{$imgSrc}" />-->
        <a href="#" style="color:white;text-decoration:none;"><xsl:value-of select="@Label"/></a>
    </h3>
</xsl:if>

</div>
<div id="test1">
  <xsl:apply-templates select="./NavItem[@Type='Folder' and @SequenceNumber]"/>
  <xsl:apply-templates select="./NavItem[@Type='Shortcut']"/>
  <xsl:apply-templates select="./NavItem[@Type='Folder' and not(@SequenceNumber)]"/>
</div>

这是我的CSS

 #<xsl:value-of select="$selector"/> h3,  #<xsl:value-of select="$selector"/> 
       {

        width:200px;
        font-family:calibri;
        white-space:nowrap;
        background-color:#f2f2f2;
        font-size:15px;         
        padding:5px;
        margin:3px;
        text-decoration:none;

       }
      #<xsl:value-of select="$selector"/> div a {
        display: none;
        text-decoration: none;
        width:270px;
        padding:5px;
        margin:3px;
        font-family:calibri;
        color:white;
        white-space:nowrap;
        background-color:#f2f2f2;
        font-size:15px;
        letter-spacing:1px;

      }
      #<xsl:value-of select="$selector"/> div a:hover {
        text-decoration: none;
        background-color:#d2d2d2;
      }
    #check1
    {
        background:url('blue_1.png') repeat-x center; 
        font-family:Calibri !important;
        font-size:14px !important;
        color:white;
        letter-spacing:2px;
        padding:5px;
        height:22px;            
        vertical-align:middle;
    }
    #check2
    {
        background:url('pink_2.png') repeat-x center; 
        font-family:Calibri !important;
        font-size:14px !important;
        color:white;
        letter-spacing:2px;
        padding:5px;
        height:22px;            
        vertical-align:middle;
    }

#h3，#
{
宽度：200px；
字体系列：calibri；
空白：nowrap；
背景色：#F2F2；
字体大小：15px；
填充物：5px；
保证金：3倍；
文字装饰：无；
}
#a组{
显示：无；
文字装饰：无；
宽度：270px；
填充物：5px；
保证金：3倍；
字体系列：calibri；
颜色：白色；
空白：nowrap；
背景色：#F2F2；
字体大小：15px；
字母间距：1px；
}
#a组：悬停{
文字装饰：无；
背景色：#d2d2d2；
}
#支票1
{
背景：url（'blue_1.png'）repeat-x中心；
字体系列：Calibri！重要；
字体大小：14px！重要；
颜色：白色；
字母间距：2px；
填充物：5px；
高度：22px；
垂直对齐：中间对齐；
}
#支票2
{
背景：url（'pink_2.png'）repeat-x中心；
字体系列：Calibri！重要；
字体大小：14px！重要；
颜色：白色；
字母间距：2px；
填充物：5px；
高度：22px；
垂直对齐：中间对齐；
}

请帮助我如何应用Jquery Accordian

1） 我的信息 2） 我的联系人

当用户单击第一个“我的信息”按钮时

在sub accordion菜单中，这些是值 个人信息和邮寄地址

当用户单击第二个手风琴菜单“我的联系人”时 在sub accordion菜单中，这些是值 电话和电子邮件

很抱歉问了这么长的问题

请帮助我如何将Jquery accordian应用于上述代码

谢谢和问候 Mahadevan

你看过吗：

将XSL代码更改为：

<div id="accordion">
<xsl:if test="position() mod 5 = 0">
    <h3 title="{@Description}" id="check5">
        <!--<img src="{$imgSrc}" />-->
        <xsl:value-of select="@Label"/>
    </h3>
</xsl:if>

<xsl:if test="position() mod 5 = 1">
    <h3 title="{@Description}" id = "check1" >
        <!--<img src="{$imgSrc}" />-->
        <a href="#" style="color:white;text-decoration:none;"><xsl:value-of select="@Label"/></a>
    </h3>
</xsl:if>
</div>

将以下内容添加到标题：

<script>
  $(function() {
    $( "#accordion" ).accordion();
  });
</script>

$（函数（）{
$（“#手风琴”）。手风琴（）；
});

Hi我已经尝试了上面的代码所有人突然我的第一个he标记消失了，我得到了一个错误脚本438：对象不支持属性或方法“accordio”，我甚至为JqueryHi添加了CDN我添加了jquery ui.js现在我没有得到任何错误，但我的第一个h3标记消失了，请帮助解决这个问题，你可以粘贴吗源代码？我不知道你的h3是怎么消失的。整个代码消失了吗？