Question

$('#addAllButton').click(function () {
            var options = '';
            $('#fromList').find('option').each(function () {
                alert($(this).val());
                //options += '<option value="' + $(this).val() + '">' + $(this).text() + '</option>';
            });
            $('#toList').append(options);
        });

<select id="fromList" name="drop1" class="listBox" multiple="multiple">
                    <option value="1">item 1</option>
                    <option value="2">item 2</option>
                    <option value="3">item 3</option>
                    <option value="4">item 4</option>
                    <option value="0">All</option>
</select>

<select id="toList" name="drop1" class="listBox" multiple="multiple">
                        <option value="1">item 1</option>
                        <option value="2">item 2</option>
                        <option value="3">item 3</option>
                        <option value="4">item 4</option>
                        <option value="0">All</option>
    </select>

I have a button Add All. I want this button to add every option from fromList select list to the toList. My function doesn’t seem to be working, can someone point me in the right direction?

I tried to use part of your code SpYk3HH:

$('#addAllButton').click(function () {
                //options += '<option value="' + $(this).val() + '">' + $(this).text() + '</option>';
                $('#fromList').children().appendTo($("#toList"));
            });

I couldn’t get this to work. I have a button called Add All, so when they click it it will move everything from #fromList to #toList. The above doesn’t seem to be working either.

Answer 1

To move all options from the first list to the second:

$('#addAllButton').click(function() {
    var options = $('#fromList').find('option');
    $('#toList').append(options);
});​

JS Fiddle demo.

If, as it seems from comments/answers elsewhere, you want to move all except the last of the option elements, then:

$('#addAllButton').click(function() {
    var options = $('#fromList').find('option').slice(0,$('#fromList').find('option').length -1);
    $('#toList').append(options);
});​

JS Fiddle demo.

References:

• append().
• find().
• slice().