cloning a select list which is dynamically created

My requirement is to clone the selectbox (where option are dynamic populated ). I am trying to use the solution at - jquery remove/add select options after cloning select list

My view codes is-

<tr> <td>Reference Table:</td>
<td><g:select name="tableCombo"
            noSelection="${['':message(code:'Select Table')]}"
            from="${result}" value="${tableName }" onchange="${remoteFunction(action:'getColumns', update:'columns', params:'\'tableCombo=\' + this.value')}"/> </td></tr>
<tr id ="cons"><td nowrap>Constraint On:</td>
        <td nowrap><g:select name="columns" from="[]" /></td>
        <td nowrap>Constraint Value:</td>
        <td nowrap><g:textField name="columnValue" value="${enterVal }" />                  
<a id="clone" >Clone</a>  ///how to call clone

I am new to jquery so Kindly suggest how to do it. want to clone cons on click.

thanks.

Solution

This: ?

$('#clone').click(function() {
   var consClone = $('#cons').clone();

   // now depends where you would like to put the copy 
   // of consClone to, for example, to the same table as the original #cons was:
   $('#cons').parent().append(consClone);   
});

Be warned though, it's better to have one id in an entire document, one quick way is to use class instead of id for cons