Question

I have an html dropdown :

<select name="name1">
<option value="1">John</option>
<option value="2">Doe</option>
<option value="3">Foo</option>
<option value="4">Bar</option>
</select>

Is there a jQuery function that generates the same options but a different dropdown name like:

<select name="name2">
<option value="1">John</option>
<option value="2">Doe</option>
<option value="3">Foo</option>
<option value="4">Bar</option>
</select>

Answer 1

Try cloning and changing the name,

var $newSelect = $('select[name=name1]').clone().attr('name', 'name2');

append/prepend the $newSelect to anywhere in your document 🙂

Also as David suggested you can dynamically generate the name using below approach,

var $newSelect = $('select[name=name1]')
                    .clone()
                    .attr('name', function(i,n) { 
                         var int = 
                                parseInt(n.match(/\d*/),10); 
                         return n.replace(/\d*/, int + 1); 
                     });