Item level class

by Andrew Maestro

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<ul>
  <li class="mega-menu">
    <a href="#">link 1</a>
    <ul>
      <li>
        <a href="#">link item 1</a>
        <ul>
          <li><a href="#">link item item 1</a></li>
          <li><a href="#">link item item 2</a></li>
          <li><a href="#">link item item 3</a></li>
        </ul>
      </li>
      <li>
        <a href="#">link item 2</a>
        <ul>
          <li><a href="#">link item item 1</a></li>
          <li><a href="#">link item item 2</a></li>
          <li><a href="#">link item item 3</a></li>
        </ul>
      </li>
      <li>
        <a href="#">link item 3</a>
        <ul>
          <li><a href="#">link item item 1</a></li>
          <li><a href="#">link item item 2</a></li>
          <li><a href="#">link item item 3</a></li>
        </ul>
      </li>
    </ul>
  </li>
  <li>
    <a href="#">link 2</a>
    <ul>
      <li><a href="#">link item 1</a></li>
      <li><a href="#">link item 2</a></li>
      <li><a href="#">link item 3</a></li>
    </ul>
  </li>
  <li>
    <a href="#">link 3</a>
    <ul>
      <li><a href="#">link item 1</a></li>
      <li><a href="#">link item 2</a></li>
      <li><a href="#">link item 3</a></li>
      <li><a href="#">link item 4</a></li>
    </ul>
  </li>
</ul>

JavaScript

$('li').filter(function() {
  let item = $(this).parents('li').length;
  $(this).addClass('item-' + item);
});