Question

When the page first loads I have a select element populated with multiple option nested elements.

Next to it is an “ADD” button which dynamically adds a new select element with a button “ADD” next to it.

I was wondering how can I copy the option elements from the first select element into every subsequent dynamically created select element with jQuery?

Answer 1

If I understood you correct you want to copy the options from one select to other(s)? If so this should work (untested):

(function($) {
    $('a').click(function() {
        var $options = $('.theSelect option').clone();
        $('.otherSelects').append($options);

        $newSelect = $('<select></select>').append($options);

        $('body').append($newSelect);

        return false;
    });
})(jQuery);​

http://jsfiddle.net/PeeHaa/twffL/1/