JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app>
    <div ng-controller="MainController">
        <div>	<span>{{test}}</span>

        </div>
        <div style="margin-left:90px;">
            </br>
            </br>
            <table>
                <tr style="height:35px;margin-bottom:10px;">
                    <td colspan="3">Branch:&nbsp;&nbsp;
                        <input type="text" value="33Z" />&nbsp;&nbsp;
                        <input type="button" value="search" ng-click="SearchButtonClick()" />
                    </td>
                    </td>
                </tr>
                <tr>
                    <td colspan="3"></td>
                </tr>
                <tr style="height:35px;margin-bottom:10px;">
                    <td colspan="3">FA:&nbsp;&nbsp;
                        <select id="FaName" name="FaName" ng-model="FaName" ng-init="idx=0" ng-change="FaChange()" ng-options="idx as choice for (idx,choice) in FaNames"></select>
                        <tr style="height:35px;margin-bottom:10px;">
                            <td colspan="3">Group:&nbsp;&nbsp;
                                <select>
                                    <option value="OPERATIONS">Operations</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td style="background-color:#666699"><span style="margin-left:5px;color:white;background-color:#666699;width:250px;">Available</span>

                            </td>
                            <td></td>
                            <td style="background-color:#666699"><span style="margin-left:5px;color:white;background-color:#666699;width:250px;">Selected</span>

                            </td>
                            <tr>
                               ...

JavaScript

function MainController($scope) {

    $scope.selectFaIndex = 0;
    $scope.SelectedAvailItems = [];
    $scope.SelectedSelectedListItems = [];
    $scope.SelectedListItems = [[]]; //I create this as a multi dimension array to handle the startup
    $scope.AvailableListItems = [[]]; //I create this as a multi dimension array to handle the startup
    $scope.test = 'Email Form';

    $scope.selectFaIndex = $scope.FaName = "0";
    $scope.DefaultListItems = [
        [{
            email: 'john.banks@rj.com'
        }, {
            email: 'jim.chevy@rj.com'
        }, {
            email: 'ralph.stocks@rj.com'
        }],
        [{
            email: 'jim.sums@rj.com'
        }, {
            email: 'jim.camaro@rj.com'
        }, {
            email: 'jeff.money@rj.com'
        }],
        [{
            email: 'fred.pays@rj.com'
        }, {
            email: 'steve.acura@rj.com'
        }, {
            email: 'ryan.bills@rj.com'
        }]
    ];

    $scope.FaNames = ['Jack.Taylor - 1256', 'Paul.Smith - 0125', 'Scott.Squared - 3333'];

    angular.copy($scope.DefaultListItems, $scope.AvailableListItems);

    $scope.FaChange = function () {

        if ($scope.SelectedListItems.length < $scope.AvailableListItems.length) {
            var x = $scope.SelectedListItems.length;
            while (x < $scope.DefaultListItems.length) {
                $scope.SelectedListItems.push([]);
                x++;
            }
        }
        $scope.selectFaIndex = $scope.FaName;
        $scope.SelectedSelectedListItems = [];
        $scope.SelectedAvailItems = [];



    };


    $scope.OnAvailableChange = function () {

        $scope.AvailLength = $scope.SelectedAvailItems.length;

    };

    $scope.SearchButtonClick = function () {


        $scope.AvailableListItems = [];
        $scope.SelectedListItems = [[]];
        $scope.SelectedSelectedListItems = [];
        $scope.SelectedAvailItems = [[]];
        $scope.selectFaIndex = $scope.FaName = "0";


       ...