Q:

Открытие submenu по клику

Открываются все ul.catalog__submenu.
Как избежать этого, без создания новых классов. 
Прошу помощи с открытием по этапано submenu

$(".catalog__open").on("click", function() {
  $(".catalog__submenu").toggle();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
  <li><a href="#" class="catalog__open">1</a>
    <ul class="catalog__submenu" style="display:none">
      <li><a href="#">2</a>
        <ul class="catalog__submenu" style="display:none">
          <li><a href="#">2.1</a></li>
          <li><a href="#">2.2</a></li>
          <li><a href="#">2.3</a></li>
        </ul>
      </li>
      <li><a href="#">3</a></li>
      <li><a href="#">4</a></li>
      <li><a href="#">5</a></li>
      <li><a href="#">6</a></li>
    </ul>
  </li>
  <li><a href="#" class="catalog__open">7</a>
    <ul class="catalog__submenu" style="display:none">
      <li><a href="#">8</a></li>
      <li><a href="#">9</a></li>
      <li><a href="#">10</a></li>
    </ul>
  </li>
</ul>

A:

Если с минимальным изменением вашего кода, будет так:

$(".catalog__open").on("click", function() {
  /* Определяем номер кликнутого меню */
  var x = $(this).index('.catalog__open');
  /* По тому же номеру открываем суб-меню */
  $( ".catalog__submenu:eq(" + x + ")" ).toggle();

  console.log(x);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<ul>
  <li><a href="#" class="catalog__open">1</a>
    <ul class="catalog__submenu" style="display:none">
      <li><a href="#" class="catalog__open">2</a><!--сюда добавил еще класc__open-->
        <ul class="catalog__submenu" style="display:none">
          <li><a href="#">2.1</a></li>
          <li><a href="#">2.2</a></li>
          <li><a href="#">2.3</a></li>
        </ul>
      </li>
      <li><a href="#">3</a></li>
      <li><a href="#">4</a></li>
      <li><a href="#">5</a></li>
      <li><a href="#">6</a></li>
    </ul>
  </li>
  <li><a href="#" class="catalog__open">7</a>
    <ul class="catalog__submenu" style="display:none">
      <li><a href="#">8</a></li>
      <li><a href="#">9</a></li>
      <li><a href="#">10</a></li>
    </ul>
  </li>
</ul>

Если надо будет при клике на новый пункт - закрыть предыдущий, такой случай описан здесь (2-й пункт) → JavaScript переключаемые вкладки - табы (и немного CSS)

