Select content after image

Question

I've this code

<div class="article">
  <img class="image-article" src="#" />
  "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quae quidem vel cum periculo est quaerenda"
</div>

I want to select the text content after the image, I want the text to be put into a <p></p>

Thanks for your replies !

Answer 1

You can use .wrap() on the next sibling element of the img

$('.article .image-article').each(function() {
  if (this.nextSibling.nodeType == Node.TEXT_NODE) {
    $(this.nextSibling).wrap('<p></p>')
  }
})

.article p {
  background-color: lightgrey;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="article">
  <img class="image-article" src="#" />"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quae quidem vel cum periculo est quaerenda"
</div>