double click function in jquery for select option element

Question

I have created two selectBoxes ,I am passing data from one box to another through buttons using jquery. On click of the button ,the data passes.I want the same functionality to work when i double click that select option element as well,but its not working.

$(document).ready(function () {
        $("#ShiftRight,#ShiftLeft").click(function (event) {

                var ID = $(event.target).attr("ID");
                var ChooseFrom = ID == "ShiftRight" ? "#ChooseLeft" : "#ChooseRight";
                var moveTo = ID == "ShiftRight" ? "#ChooseRight" : "#ChooseLeft";

                var SelectData = $(ChooseFrom + " :selected").toArray();
                $(moveTo).append(SelectData);
                SelectData.remove;
            });
        });

Answer 1

You can use the jquery on( "click dblclick", handler ) . The dblclick event is sent to an element when the element is double-clicked.

$("#ShiftRight,#ShiftLeft").on("dblclick click", function() { 

    var ID = $(event.target).attr("ID");
    var ChooseFrom = ID == "ShiftRight" ? "#ChooseLeft" : "#ChooseRight";
    var moveTo = ID == "ShiftRight" ? "#ChooseRight" : "#ChooseLeft";

    var SelectData = $(ChooseFrom + " :selected").toArray();
    $(moveTo).append(SelectData);
    SelectData.remove;
});

Answer 2

You can use dblclick for double click event.

 $(document).ready(function () {
    $("#ShiftRight,#ShiftLeft").dblclick(function (event) {

            var ID = $(event.target).attr("ID");
            var ChooseFrom = ID == "ShiftRight" ? "#ChooseLeft" : "#ChooseRight";
            var moveTo = ID == "ShiftRight" ? "#ChooseRight" : "#ChooseLeft";

            var SelectData = $(ChooseFrom + " :selected").toArray();
            $(moveTo).append(SelectData);
            SelectData.remove;
        });
    });