JQuery заменить часть имени класса с шаблоном

Question

Я выбираю все классы по классам, которые начинаются с photo-.Заменить часть имени класса шаблоном.Мне нужно заменить photo-gallery-RID459852 на photo-gallery.Примечание: деталь -RID[0-9] заменена на ""

$("#Master [class*='photo-']").replace(function(index, css) {
  return (css.match(/(^|\s)-RID\S+/g) || []).join(' ');
}, "");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<main id="Master">
  <div class="photo-gallery-RID459852 other any some">
    Algo
  </div>
  <div class="photo-gallery-RID987410 other any some2 other2"></div>
  <div>
    <div>
      <div class="photo-gallery-369841 other any some"></div>
    </div>
  </div>
  <article>
    <div class="photo-gallery-RID36541 here now other any some"></div>
  </article>
</main>

Мой jsFiddle: https://jsfiddle.net/ngqku78p/

Answer 1

Ваш текущий код не работает, так как у объектов jQuery нет метода replace().

Для получения требуемого результата вы можете зациклить каждый класс на элементе и удалить RIDXXX из его имени.Для этого вы можете использовать коллекцию classList вместе с методом replace(), например:

$("#Master [class*='photo-']").each(function(i, el) {
  el.classList.forEach(function(className) {
    el.classList.replace(className, className.replace(/\-RID\d+/g, ''));
  });
});

.photo-gallery {
  color: #C00;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<main id="Master">
  <div class="photo-gallery-RID459852 other any some">Algo</div>
  <div class="photo-gallery-RID987410 other any some2 other2">Lorem</div>
  <div>
    <div>
      <div class="photo-gallery-369841 other any some">ipsum</div>
    </div>
  </div>
  <article>
    <div class="photo-gallery-RID36541 here now other any some">dolor</div>
  </article>
</main>

Answer 2

Возможно, вы имели в виду это?

Вы можете перебрать classList, но это работает и для ваших примеров

$("#Master [class*='photo-']").each(function() {
  console.log("Before", this.className)
  this.className = this.className.replace(/photo-gallery-RID.*? /g, "photo-gallery ");
  console.log("After ", this.className)
});

.photo-gallery {
  font-weight: bold;
}

.other {
  font-style: italic;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<main id="Master">
  <div class="photo-gallery-RID459852 other any some">
    Algo
  </div>
  <div class="photo-gallery-RID987410 other any some2 other2">RID987410</div>
  <div>
    <div>
      <div class="photo-gallery-369841 other any some">369841</div>
    </div>
  </div>
  <article>
    <div class="photo-gallery-RID36541 here now other any some">RID36541</div>
  </article>
</main>