Question

<select id="name" >
    <option value="" selected="selected">Please select</option>
    <option value="Alex">Alex</option>
    <option value="Greg">Greg</option>
</select>

If we try to append an option to it, by

$('<option>Hi</option>').appendTo($('#name'))

then, the option is added to the select box, as is expected. But, if we do the following :

var a = $('#name option')[1];
$(a).appendTo($('#name'));

then, the option is not appended to the options. Instead, “Alex” now comes at the end. My question is that another “Alex” option should have been appended at the end, with the original “Alex” remaining in its place

Answer 1

$('#name option')[1] 

SELECTS the element.

When you SELECT an element, you select it. lol..

It is not COPIED. To get the desired result you must do

var a = $('#name option')[1];
$(a).clone().appendTo($('#name'));