JSFiddle - React, Tailwind, and code Playground

by Ashish

HTML

<form name="frm" onsubmit="return false;">
	<select name="list1" multiple="multiple">
		<option value="1">Option 1</option>
		<option value="2">Option 2</option>
    </select>
	<button onclick="shiftRight()">>></button>
	
	<select name="list2" multiple="multiple">
		<option value="1">Option 3</option>
		<option value="2">Option 4</option>
	</select>
	<button onclick="shiftLeft()" ><<</button>
</form>

JavaScript

function shiftRight()
{
    var selItem = document.forms[0].list1.selectedIndex;
    if (selItem == -1)
	{
        window.alert("Select Item From List")
    }
	else
	{
        document.forms[0].list2.add(document.forms[0].list1[selItem], null);
    }
}

function shiftLeft()
{
    var selItem = document.forms[0].list2.selectedIndex;
    if (selItem == -1)
	{
        window.alert("Select Item From List")
    }
	else
	{
        document.forms[0].list1.add(document.forms[0].list2[selItem], null);
    }
}