Табы на jquery

$('.tabs__link').on('click', function () {
    $('.tabs__link').removeClass('tabs__link--active');
    $('.tabs__content').hide();
    $index = $(this).index();
    $(this).addClass('tabs__link--active');
    $('.tabs__content').eq($index).show('slow');
})

<div class="personal__tabs tabs">
    <div class="tabs__header">
        <span class="tabs__link tabs__link--active personal__capture">
            Мои заказы
        </span>
        <span class="tabs__link personal__capture">
            Товары
        </span>
        <span class="tabs__link personal__capture">
            Отслеживание груза
        </span>
        <span class="tabs__link personal__capture">
            Моя компания
        </span>
        <span class="tabs__link personal__capture">
            Ваш менеджер
        </span>
    </div>
    <div class="tabs__body">
        <div class="tabs__content tabs__content--active">
            Степаненко Наталья Юрьевна 1
        </div>
        <div class="tabs__content">
            Степаненко Наталья Юрьевна 2
        </div>
        <div class="tabs__content">
            Степаненко Наталья Юрьевна 3
        </div>
        <div class="tabs__content">
            Степаненко Наталья Юрьевна 4
        </div>
        <div class="tabs__content">
            Степаненко Наталья Юрьевна 5
        </div>
    </div>
</div>

.tabs {
  margin-top: 30px;
  &__link {
    display: inline-block;
    cursor: pointer;
    padding: 16px 20px 15px;
    font-size: 14px;
    margin-bottom: 0;
    border-radius: 5px 5px 0 0;
    &--active, &:hover {
      background: #1C1D26;
      opacity: 1;
    }
  }
  &__body {
    padding: 30px;
    background: #1C1D26;
  }
  &__content {
    display: none;
    &--active {
      display: block;
    }
  }
}⁠