How the item is active based on position in xml using xslt

Here i will show how to create position  based div's from XML data source using xslt.The XML data source has parent attribute with three items .There is on click function to make the selected div as active .By default we will set the first items as active link

<?xml version="1.0" encoding="utf-8" ?> 
- <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
- <xsl:template match="/">
<div>
- <ul>
- <xsl:for-each select="Menu/Item">
- <xsl:if test="ItemType != 'Javascript'">
- <li>
- <xsl:if test="position() = 1">
- <xsl:attribute name="class">
  <xsl:text>active</xsl:text> 
  </xsl:attribute>
  </xsl:if>
- <a title="" onclick="return false;">
- <xsl:attribute name="href">
- <xsl:choose>
- <xsl:when test="position() = 1">
  <xsl:text>#stories</xsl:text> 
  </xsl:when>
- <xsl:when test="position() = 2">
  <xsl:text>#events</xsl:text> 
  </xsl:when>
- <xsl:when test="position() = 3">
  <xsl:text>#news</xsl:text> 
  </xsl:when>
  </xsl:choose>
  </xsl:attribute>
  <xsl:value-of select="ItemTitle" /> 
  </a>
  </li>
  </xsl:if>
  </xsl:for-each>
  </ul>
</div>
  </xsl:template>
  </xsl:stylesheet>