JSFiddle - React, Tailwind, and code Playground

HTML

<label>Source<br>
<select id="source" size="5">
	<option value="c1">Category1</option>
	<option value="c2">Category2</option>
	<option value="c3">Category3</option>
	<option value="c4">Category4</option>
</select>
</label>
<br>
<label>Target<br>
<select id="target" size="10">
	<option value="c1">Category1</option>
	<option value="c2">Category2</option>
	<option value="c3">Category3</option>
	<option value="c4">Category4</option>
</select>
</label>
<p>
  <button id="button1">Add</button>
</p>

JavaScript

$(function() {
  $("#button1").click(function(){    
    var selectedOption = $("select#source");
    $("select#target").append(selectedOption.html()).attr("disabled", "disabled");
    $("select#target option:selected").removeAttr("selected");
  });
});