使用jQuery将HTML的一个块映射到另一个

我有一个包含多个图像的div，需要用一个<ul>包含<li>每个图像的块替换。因此，下面的第1块需要替换为第2块。

Block1

       <div id="box">
           <img src="images/pic1.jpg">
           <img src="images/pic2.jpg">
           <img src="images/pic3.jpg">
                     etc.  
        </div>



 Block2

       <ul>
           <li>
               <img src="images/pic1.jpg">
           </li>
           <li>
                <img src="images/pic2.jpg">
           </li>
           <li>
                <img src="images/pic3.jpg">
           </li>
                           etc.
       </ul>

我开始于：

$('<ul id='wrapper'>);  
$('#box').find('img').each(function() {  
                src = $(this).find('img')[0]; 
                $('<li><img src=src></li>).appendTo('ul#wrapper') ; 
                 });

但这似乎笨拙，不太可能奏效，我认为必须有一种更优雅的方法来实现这一目标。

有没有人有什么建议？

谢谢