Я хочу сгруппировать следующий html:

 lt;h2gt;Summarize the problemlt;h2gt; lt;h3gt;Include details about your goallt;h3gt; lt;h3gt;Include details about your goallt;h3gt; lt;h3gt;Include any error messageslt;h3gt;  lt;h2gt;Describe What you have trieslt;h2gt; lt;h3gt;Show what you’ve tried and tell us what you foundlt;h3gt; lt;h3gt;Lorem Ipsum LOLlt;h3gt;  ...  

в

  lt;divgt;  lt;h2gt;Summarize the problemlt;/h2gt;  lt;h3gt;Include details about your goallt;/h3gt;  lt;h3gt;Include details about your goallt;/h3gt;  lt;h3gt;Include any error messageslt;/h3gt; lt;/divgt;  lt;divgt;  lt;h2gt;Describe What you have trieslt;/h2gt;  lt;h3gt;Show what you’ve tried and tell us what you foundlt;/h3gt;  lt;h3gt;Lorem Ipsum LOLlt;/h3gt; lt;/divgt;  

Что я пробовал

Я пробовал перебирать все элементы, но ничего не получалось. Я не помещаю код здесь, как я обнаружил, это даже не имеет никакого смысла

Вот рабочая версия.

 $("h2").each(function() {   const $this = $(this)  const $h3 = $this.nextUntil("h2"); // find all tags until next H2  $this  .wrap('lt;div class="wrapper" /gt;')  .after($h3) }) 

 .wrapper { border: 1px solid black } 

 lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"gt;lt;/scriptgt; lt;h2gt;Summarize the problemlt;/h2gt; lt;h3gt;Include details about your goallt;/h3gt; lt;h3gt;Include details about your goallt;/h3gt; lt;h3gt;Include any error messageslt;/h3gt;  lt;h2gt;Describe what you have triedlt;/h2gt; lt;h3gt;Show what you've tried and tell us what you foundlt;/h3gt; lt;h3gt;Lorem Ipsum LOLlt;/h3gt;