jQuery select HTML between two string identifiers

Question

I'm trying to make a slideshow of images and all I have is a rich text editor to enter the images and text. So from this html:

<h1>title</h1>
<p>description...</p>

<p>#slider</p>

<p><img src="a.jpg" /></p>
<p><img src="b.jpg" /></p>
<p><img src="c.jpg" /></p>

<p>#end-slider</p>

How would you select the html between #slider and #end-slider ?

It's a similar concept to extracting text between [link] and [/link] in blog comments e.g.: [link]http://google.com[/link]

Answer 1

$(document).ready(function() {
    $('p:contains("#slider")')
      .nextUntil('p:contains("#end-slider")')
      .wrapAll("<div id='stuff'></div>");
    var required = $('#stuff').html();
});

http://jsfiddle.net/483kL/