title: Create <a> tags around divs using Jquery
body: <p>I'm using Jquery to create multiple products within a page using the below code..</p>
  
  <pre><code>    $("#product-container").empty()
      slicedata.forEach(function(e,i,a){
          var obj = e;
          i = parseInt(obj.id)
          $("&lt;a href = /product &gt;").appendTo('#product-container')
          $("&lt;div id = productid" + i + " class = product-cards &lt;/div&gt;").appendTo('#product-container')
          $("&lt;div id='product" + i + "left'  class='product-cards-left' style='background-image:url(  " + imagepath_start + obj.image_caption + ")'&gt; &lt;/div&gt;").appendTo('#productid' + i);
          $("&lt;div id = product" + i + "right class = product-cards-right&gt; &lt;/div&gt;").appendTo('#productid' + i   )
          $("&lt;label&gt;&lt;b&gt;  Price: &lt;b&gt;&lt;/label&gt;  &lt;label&gt;" + '$' + obj.price + "&lt;/label&gt;&lt;br&gt;").appendTo('#product' + i +"right"   )
          $("&lt;label&gt;&lt;b&gt;  Old Price: &lt;b&gt;&lt;/label&gt;  &lt;label&gt;" + '$' + obj.old_price + "&lt;/label&gt;&lt;br&gt;").appendTo('#product' + i +"right"   )
          $("&lt;label&gt;&lt;b&gt;  Author Name: &lt;b&gt;&lt;/label&gt;  &lt;label&gt;" + obj.author_name + "&lt;/label&gt;").appendTo('#product' + i +"right"   )
          $("&lt;div id= elementid style='display:none' &gt;"+ obj.id+" &lt;/div&gt;").appendTo('#product' + i +"right"   )
      })
  </code></pre>
  
  <p>Now,I need to add an <code>&lt;a&gt;</code> tag around the divs, so that when the user clicks the product card he will be taken to the details page...</p>
  
  <p>I'm using the <code>&lt;a&gt;</code> tag to build around each product using the below stmt but it creates the <code>&lt;a&gt;</code> and closes it immediately..I need to close the <code>&lt;a&gt;</code> after all the divs(ie; products are created).</p>
  
  <pre><code>    $("&lt;a href = /product &gt;").appendTo('#product-container')
  </code></pre>