Jquery adding and removing items from listbox

Question

I\'ve created this fiddle, it allows the user to click on either art or video, dynamically populating the the second listbox with the list associated with those selections. Ther

Answer 1

Try:

$(function () {
    var artItems = ["Art 1", "Art 2", "Art 3", "Art 4", "Art 5", "Art 6"];
    var vidItems = ["Video 1", "Video 2", "Video 3", "Video 4", "Video 5", "Video 6"];
    $('#SelectBox').change(function () {
        var str = "",
            inHTML = "",
            items;
        items = $(this).val() == 'art' ? artItems : vidItems;
        $.each(items, function (i, ob) {
            inHTML += '' + ob + '';
        });
        $("#SelectBox2").empty().append(inHTML);
    });

    $('#SelectBox2').change(function () {
        $("#selectedValues").text($(this).val() + ';' + $("#SelectBox").val());
        $('#hidden1').val($(this).val());
    });

    $('#add').click(function () {
        inHTML = "";
        $("#SelectBox2 option:selected").each(function () {
            if ($("#SelectedItems option[value=" + $(this).val() + "]").length == 0) {
                inHTML += '' + $(this).text() + '';
            }
        });
        $("#SelectedItems").append(inHTML);
    });

    $('#remove').click(function () {
        $('#SelectedItems option:selected').remove();
    });
});

Fiddle here