Q:

jQuery - Get all html in between some tags

I need to scrape a website which looks like this:
<p></p>

<!-- I want to get HTML from here... -->

<h2> </h2>
<table> </table>

<h2> </h2>
<table> </table>

<h2> </h2>
<table> </table>

<!-- to here -->

<div> </div>

<h2> </h2>
<table> </table>

As annotated above, I want to get all the HTML between <p> and the <div>. I don't want the <h2> and <table> below the div.
Is there a good way to scrape those parts? If possible, I want to avoid targeting child index.
Thanks

A:

$('p').nextUntil('div').addClass('add')
.add{color:red}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p></p>

<!-- I want to get HTML from here... -->

<h2> I want to get HTML from here...</h2>
<table><tr><td>I want to get HTML from here...</td></tr> </table>

<h2> I want to get HTML from here...</h2>
<table><tr><td>I want to get HTML from here...</td></tr> </table>

<h2> I want to get HTML from here...</h2>
<table><tr><td>I want to get HTML from here...</td></tr> </table>

<!-- to here -->

<div> </div>

<h2> </h2>
<table> </table>

Use .nextUntil()

Get all following siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object passed.

A:

Use .nextUntil() to get all next element from specific element to any particular element.

console.log($("p:first").nextUntil("div"))
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p></p>

<!-- I want to get HTML from here... -->

<h2> </h2>
<table> </table>

<h2> </h2>
<table> </table>

<h2> </h2>
<table> </table>

<!-- to here -->

<div> </div>

<h2> </h2>
<table> </table>

