jquery clone form fields and increment id
<p>I have a block of form elements which I would like to clone and increment their ID's using jQuery clone method. I have tried a number of examples but a lot of them only clone a single field.</p>

<p>My block is structured as such:</p>

<pre><code>&lt;div id="clonedInput1" class="clonedInput"&gt;
  &lt;div&gt;
    &lt;div&gt;
      &lt;label for="txtCategory" class=""&gt;Learning category &lt;span class="requiredField"&gt;*&lt;/span&gt;&lt;/label&gt;
      &lt;select class="" name="txtCategory[]" id="category1"&gt;
        &lt;option value=""&gt;Please select&lt;/option&gt;
      &lt;/select&gt;
    &lt;/div&gt;
   &lt;div&gt;
     &lt;label for="txtSubCategory" class=""&gt;Sub-category &lt;span class="requiredField"&gt;*&lt;/span&gt;&lt;/label&gt;
     &lt;select class="" name="txtSubCategory[]" id="subcategory1"&gt;
       &lt;option value=""&gt;Please select category&lt;/option&gt;
     &lt;/select&gt;
   &lt;/div&gt;
   &lt;div&gt;
     &lt;label for="txtSubSubCategory"&gt;Sub-sub-category &lt;span class="requiredField"&gt;*&lt;/span&gt;&lt;/label&gt;
     &lt;select name="txtSubSubCategory[]" id="subsubcategory1"&gt;
       &lt;option value=""&gt;Please select sub-category&lt;/option&gt;
     &lt;/select&gt;
   &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p></p>

<p>Obviously elements are lined up a lot better but you get the idea.</p>

<p>I would like to keep the id structure i.e. category1, subcategory1 etc as I use these to dynamically display select options based on the parent selection so if its possible to have each cloned block like category1/category2/category3 etc that would be great.</p>
