xslt self match child node but with different html div id

Question

I am transforming xml to html using saxon.

I have xml like this:

<abc> 
  level-1 
   <abc> 
    level-2
      <abc>
         level-x 
      </abc> 
   </abc> 
 </abc>

in html i want to do something like this:

<div class="abc-1">
 level-1
    <div class="abc-2">
     level-2
       <div class="abc-3">
         level-3
        </div> 
    </div> 
</div>

Now in my xslt i want to do somthing like following, so i can have different class names in child node with same node match, but not sure what could be good and optimized way to do this in xslt.

<xsl:template match = "abc">
  <div class="abc<x>">
     <xsl:apply-templates />
  </div>
</xsl:template>

Answer 1

<xsl:template match="abc">
  <div class="abc-{count(ancestor-or-self::abc)}">
     <xsl:apply-templates />
  </div>
</xsl:template>