selecting & wraping

selecting & wraping

I have a box like this:
  1. <div id="x">
        <p>sss</p>
        <p>xxx</p>
        <hr class="stop" />
        <p>sss</p>
        <p>xxx</p>
        <hr class="stop" />
        <p>sss</p>
        <p>xxx</p>
        <hr class="stop" />
        <p>sss</p>
        <p>xxx</p>
    </div>











<hr>s separate elements which should be wrapped in <div class="wrap+1" />. Than <hr>s should be removed at the end to receive code like this:
  1. <div id="x">
  2.         <div class="class1">
                        <p>sss</p>
                        <p>xxx</p>

  3.         </div>
            <div class="class2">
                        <p>sss</p>
                        <p>xxx</p>       



  4.         </div>
  5.         <div class="class3">
                        <p>sss</p>
                        <p>xxx</p>       


  6.         </div>
  7.         <div class="class4">
                        <p>sss</p>
                        <p>xxx</p>       


  8.         </div>
    </div>

How would you handle it?

Thanks for any suggestions.