jQuery addClass example

Change class name on click in jQuery

HTML

<div class="bl_subNav__full hidden">
  <ul class="bl_subNav__children">
    <li class="bl_subNav__field">
      <ul class="bl_subNav_wrapper">
        <li class="bl_subNav__link">
          <a class="bl_subNav__name" href="ссылка1">
            <p class="bl_subNav__name">Куртки</p>
            <img class="bl_subNav__img" src="" alt="Куртки">
          </a>
        </li>
        <li class="bl_subNav__link">
          <a class="bl_subNav__name" href="ссылка2">
            <p class="bl_subNav__name">Обувь</p>
            <img class="bl_subNav__img" src="" alt="Обувь">
          </a>
        </li>
      </ul>
    </li>
  </ul>

  <ul class="bl_subNav__children">
    <li class="bl_subNav__field">
      <ul class="bl_subNav_wrapper">
        <li class="bl_subNav__link">
          <a class="bl_subNav__name" href="ссылка3">
            <p class="bl_subNav__name">Демисезонная одежда 1</p>
            <img class="bl_subNav__img" src="" alt="Демисезонная одежда 1">
          </a>
        </li>
        <li class="bl_subNav__link">
          <a class="bl_subNav__name" href="ссылка4">
            <p class="bl_subNav__name">Демисезонная одежда 2</p>
            <img class="bl_subNav__img" src="" alt="Демисезонная одежда 2">
          </a>
        </li>
        <li class="bl_subNav__link">
          <a class="bl_subNav__name" href="ссылка5">
            <p class="bl_subNav__name">Демисезонная одежда 3</p>
            <img class="bl_subNav__img" src="" alt="Демисезонная одежда 3">
          </a>
        </li>
      </ul>
    </li>
  </ul>

  <ul class="bl_subNav__children">
    <li class="bl_subNav__field">
      <ul class="bl_subNav_wrapper">
        <li class="bl_subNav__link">
          <a class="bl_subNav__name" href="ссылка6">
            <p class="bl_subNav__name">Летняя одежда 1</p>
            <img class="bl_subNav__img" src="" alt="Летняя одежда 1">
          </a>
        </li>
        <li class="bl_subNav__link">
          <a class="bl_subNav__name" href="ссылка7">
    ...

CSS

.mobile_subNav{
  width: 100%;
  min-height: 30px;
  border: 1px solid #000;
}

JavaScript

$(".bl_fullCategories__link").each(function() {
	$(this).append('<ul class="mobile_subNav"></ul>');
});

$(".bl_subNav__children .bl_subNav__link").clone().find('img').remove().end().appendTo('.mobile_subNav')