jQuery insert an element after a comment tag

Question

I'm trying to insert <br/><br/> after the comment tag  but I'm not sure how to achieve this? my code so far:

html:

<div class="tab-content">
  some content
  <!-- pagebreak -->
  some more content
  <!-- pagebreak -->
  some more content
</div>

jQuery:

$( ".tab-content" )
  .contents()
  .filter(function() {
  return this.nodeType === 8;}
  .each().after( "<br/><br/>" ).end());

Can anyone advise on how can achieve this?

Thanks

have a look at this. https://stackoverflow.com/questions/1623734/selecting-html-comments-with-jquery?utm_medium=organic&utm_source=google_rich_qa&utm_campaign=google_rich_qa — chaos505, May 16 '18 at 14:21

score 2 · Answer 1 · answered May 16 '18 at 14:24

You were close. You don't need the each.

$(".tab-content").contents().filter(function() {
  return this.nodeType == 8;
}).after("<br><br>")

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="tab-content">
  some content
  <!-- pagebreak -->
  some more content
  <!-- pagebreak -->
  some more content
</div>

Resulting HTML:

<div class="tab-content">
  some content
  <!-- pagebreak --><br><br>
  some more content
  <!-- pagebreak --><br><br>
  some more content
</div>

jQuery insert an element after a comment tag

1 Answers1