title: How to add ul and li to each image with jquery?
body: <p>I have the following code generated dynamically. It can be just one, two, three or four images.</p>
  
  <pre><code>&lt;div id="system"&gt;       
  
      &lt;FORM ACTION="command.asp" METHOD="get" NAME="artForm"&gt;
  
      &lt;TABLE BORDER="0" CELLSPACING="0" CELLPADDING="0"&gt;
       &lt;TR&gt;
        &lt;TD VALIGN="top"&gt;
  
      &lt;H1&gt;Lian Li PC-A70FB, Maxitower, Sort&lt;/H1&gt;
      &lt;p&gt;
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
    gravida eget ultricies vel, lobortis a ipsum. Donec sollicitudin mi eget nisl 
      vestibulum et euismod elit pretium. 
      &lt;/p&gt;
  
  
  &lt;img src="images/10047_1.jpg" alt="" /&gt;
  &lt;img src="images/10059_1.jpg" alt="" /&gt;
  &lt;img src="images/10101_1.jpg" alt="" /&gt; // there could be more, or can be only one img
  
  
  
        &lt;/TD&gt;
  
   ...
   ...
  </code></pre>
  
  <p>I'd like to add ul and li tag to all the images like this.</p>
  
  <pre><code>&lt;ul class="thumb"&gt;
  
  &lt;li&gt;&lt;img src="images/10047_1.jpg" alt="" /&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src="images/10059_1.jpg" alt="" /&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src="images/10101_1.jpg" alt="" /&gt;&lt;/li&gt;
  
  &lt;/ul&gt;
  </code></pre>
  
  <p>Could anyone tell me how to do it please?</p>
  
  <p>Thanks in advance.</p>