Как на jquery найти несколько элементов идущих подряд в DOM и обернуть их в контейнер?

$(function(){ 
$('pre').text("Исходный код: " + $('div').html()); 
 
// Перебор всех тегов "p" и "обвертывание" img'ов внутри каждого "p" отдельно. 
$("p").each(function(){  
    if ($(this).children("img").length > 1) $(this).children("img").wrapAll("<span class='set'>"); 
}); 
 
 
$('pre').text($('pre').text() + "Результат: " + $('div').html()); 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<pre> 
</pre> 
<div hidden> 
 
  <p> 
     <img src /> 
     <img src /> 
  </p> 
  <p> 
     <img src /> 
     <img src /> 
     <img src /> 
  </p> 
  <p> 
     <img src /> 
  </p> 
 
</div>

for(let image of document.images){ 
  const parent = image.parentNode; 
  if(parent.classList.contains('set')) continue; 
  const span = document.createElement('span'); 
  span.classList.add('set'); 
  parent.insertBefore(span, parent.firstChild); 
  for(let child_img of parent.getElementsByTagName('img')) 
      span.appendChild(child_img); 
}

p{ 
  border: 1px solid black; 
} 
.set{ 
  display: block; 
  border: 1px solid red; 
} 
 
img{ 
   width: 20px; height: 20px; 
}

<p> 
   <img src.../> 
   <img src.../> 
</p> 
<p> 
   <img src.../> 
   <img src.../> 
   <img src.../> 
</p> 
<p> 
   <img src.../> 
</p>