JSFiddle - React, Tailwind, and code Playground

by mrchuugii

HTML

<select id="s1" MULTIPLE>
<option value=1>a1</option>
<option value=2>a2</option>
</select>
<input type=button onclick="AddRemoveItemsFromTo('s1','s2',0)" value=">">
<input type=button onclick="AddRemoveItemsFromTo('s2','s1',0)" value="<">

<input type=button onclick="AddRemoveItemsFromTo('s1','s2',1)" value=">>">
<input type=button onclick="AddRemoveItemsFromTo('s2','s1',1)" value="<<">

<select id="s2" MULTIPLE>
<option value=3>a3</option>
<option value=4>a4</option>
</select>

JavaScript

function AddRemoveItemsFromTo(fromSourceID,toSourceID, all)
        {

            var src = document.getElementById(fromSourceID); 
            var srcTo = document.getElementById(toSourceID);
            for(var count= src.options.length-1; count >= 0; count--) {  
                if(all==1 || src.options[count].selected == true) {          
                    try {
                            srcTo.appendChild(src.options[count])
                               
                    } catch(error) {                                 
                           
                    }
}
            }
        }