jquery - How to select all specific elements with all siblings of a specific element -

trying select h2's, works fine. however, h2's can have siblings of h3's want select.

for example, have:

<h2>
<h3>
<h3>
<h3>
<h2>
<h2>
<h2>
<h3>
<h3>

http://jsfiddle.net/v9upc/1/ current code, , here example of i'm trying achieve is:

-<h2>
--<h3>
--<h3>
--<h3>
-<h2>
-<h2>
-<h2>
--<h3>
--<h3>

how select h2's , if siblings h3's include them children in unordered list?

try

var $h2s = $('h2'), $div = $h2s.parent(); var totop = '<span class="top">back top</span>';  var $ct = $('<div />', {     class: 'indexholder' }).append('<h2>on page</h2>');  var $ul = $('<ul />', {     class: 'index' }).appendto($ct);  $h2s.each(function(idx, el){     var $li = $('<li />', {         id: 'index' + idx,         text: $(this).text()     }).appendto($ul);      var $h3s = $(this).nextuntil('h2', 'h3');     if($h3s.length){         var $l1ul = $('<ul />', {         }).appendto($li);          $h3s.each(function(idx2, el2){             var $li = $('<li />', {                 text: $(this).text()             }).appendto($l1ul);         })             } })  $div.replacewith($ct) 

demo: fiddle