Как обернуть дивом несколько элементов без перечисления?

Question

имею
<div id="slider2" class="slider1">
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
         <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
        <div class="item"></div>
    </div>

таких <div class="item"></div> более сотни

С помощью 

  $('.item').attr('id', function(index) { return (index + 1); })

задаю каждому **item** свой **id**

Вопрос
как мне обернуть в каждый свой див элементы 
с 1 по 5 (например)
с 6 по тридцатый 
с 31 по 60 
и так далее
60 -100

((так чтоб не перечислять id=1, id=2, id=3 и т.д.))

Answer 1

Если я правильно понял, можно, например, так (группировка 1-5, 6-8, 9-10):

const items = [...document.querySelectorAll('.item')];
const sections = [[0, 5], [5, 8], [8, 10]];

sections.forEach((section, i) => {
  const div = document.createElement('div');
  div.className = `div${i}`;
  document.body.append(div); // вставляете обёртку, куда вам нужно
  div.append(...items.slice(...section));
});

<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
<div class="item">6</div>
<div class="item">7</div>
<div class="item">8</div>
<div class="item">9</div>
<div class="item">10</div>

БЛОГ НА HUSL

Как обернуть дивом несколько элементов без перечисления?

Ответы (1 шт):