Есть html статья, нужно найти все наборы элементов, удовлетворяющих следующему условию:
Нужно найти несколько идущих друг за другом тегов p (если их больше 1), которые содержат тег img и добавить эти теги p в созданный блок с классом
<div class="owl-carousel"></div>
https://codepen.io/marishik92/pen/mdJpGGv
HTML Код примерно следующего содержания:
<h2>Заголовок H2 Номер 1</h2>
<h3>Заголовок H3</h3>
<p>Простой текст Простой текст Простой текст Простой текст<p>
<p><img src="images/image.png"></p>
<p><img src="images/image.png"></p>
<p><img src="images/image.png"></p>
<p>Простой текст Простой текст Простой текст Простой текст</p>
<h2>Заголовок H2 Номер 2</h2>
<p>Простой текст Простой текст Простой текст Простой текст<p>
<p><img src="images/image.png"></p>
<p><img src="images/image.png"></p>
<p>Простой текст Простой текст Простой текст Простой текст</p>
<h2>Заголовок H2 Номер 3</h2>
<p>Простой текст Простой текст Простой текст Простой текст<p>
<p><img src="images/image.png"></p>
<p><img src="images/image.png"></p>
<p><img src="images/image.png"></p>
<p>Простой текст Простой текст Простой текст Простой текст</p>
В данном случае должно получиться 3 слайдера.
$("p").each(function(){
if( $(this).children("img").length > 0 ) {
//создаем элемент <div class="owl-carousel"></div> и добавляем в него идущие подряд несколько тегов p с картинками
}
});
//на выходе должно получиться три блока с классом owl-carousel с расположенными в нем <p><img/></p>
Простой
