How can I cut a javascript array in half but to the nearest closing </p> or </h1> tag?

Question

I can get it cut in half, I'm just not sure how to go about making sure half goes until the next closing block level tag.

Fake Html:

<div class="content-item">    
<h1>Title</h1>
<p>Pellentesque nec erat diam. Donec condimentum tortor nec tellus gravida uscipit</p> 
<h1>Title</h1>
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus</p>
</div>

Javascript so far:

var splitChar = " ";
var wordsSplit = $(".content-item").html().split(splitChar);
var wordsCount = wordsSplit.length;
var half = Math.floor(wordsCount / 2);

Answer 1

Just iterate forward through the array until you hit the end or an closing block

i = half;
while (!wordsSplit[i++].match(/<\//) && i < wordsSplit.length);