var origen = document.getElementById("origen"), destino = document.getElementById("destino"); origen.addEventListener("click", function(event){ var opciones = Array.prototype.map.call(destino.options, function(opcion){ return opcion.value; }), valor = event.target.value, existe = opciones.indexOf(valor); if (existe > -1) destino.removeChild(destino.options[existe]); else{ var opcion = document.createElement("option"), visible = event.target.innerHTML; opcion.value = valor; opcion.text = visible; destino.appendChild(opcion); } }, false);
<select id = "origen" name = "origen[]" multiple> <option value="1">Opción 1</option> <option value="2">Opción 2</option> <option value="3">Opción 3</option> <option value="4">Opción 4</option> <option value="5">Opción 5</option> <option value="6">Opción 6</option> <option value="7">Opción 7</option> <option value="8">Opción 8</option> </select> <select id = "destino" name = "destino[]" multiple></select>