JSFiddle - React, Tailwind, and code Playground

HTML

<table id="users" class="display" width="100%" cellspacing="0">
                                        <thead>
                                            <tr>
                                                <th id="pagerID">ID</th>
                                                <th>Name</th>
                                                <th>PNumber</th>
                                                <th>Destination</th>
                                            </tr>
                                        </thead>
                                        <tfoot>
                                            <tr>
                                                <th>ID</th>
                                                <th>Name</th>
                                                <th>PNumber</th>
                                                <th>Destination</th>
                                            </tr>
                                        </tfoot>
                                </table>

JavaScript

$('#users tbody').on('click', 'tr', function () {
      var id = this.id;
      var tr;
      tr = $('<tr/>');

      var index = $.inArray(id, selected);
      console.log('the first id is:' + id);
      if (index === -1) {
          selected.push(id); //select/highlight in list of available users.
          console.log('what i ahve so far in selected:');
          console.log(selected[0]);
          // Find td's inside this tr and add to selected_users table
          var tds = $(this).find('td');
          tr.append("<td>" + tds.eq(0).text() + "</td>");
          tr.append("<td>" + tds.eq(1).text() + "</td>");
          tr.append("<td>" + tds.eq(2).text() + "</td>");
          tr.append("<td>" + tds.eq(3).text() + "</td>");
          tr.attr('id', id.substring(4));
          $('#selected_users').append(tr);

          //2015.06.11 start 
          var thisTR = $(this);
          thisTR.siblings().filter(function () {
              if ($('td', this).eq(2).text() == $('td', thisTR).eq(2).text()) {
                  add_to_selected_users($(this));
                  console.log("other id: " + this.id);
                  console.log('the check returns:' + $.inArray(this.id, selected));
                  if (($.inArray(this.id, selected)) === -1) {
                      selected.push(this.id);
                  };
              };
              //2015.06.11 stop
          });

      } else {
          selected.splice(index, 1); //deselect from list of avail users
          //remove matching record from selected_users table.
          var record_id = id.substring(4);
          var rowtodelete = document.getElementById(record_id);
          rowtodelete.parentNode.removeChild(rowtodelete);
      }
      $(this).toggleClass('selected');
  });
  });

  //2015.06.11 new function
  var add_to_selected_users = function (row) {
      var tds = row.find('td');
      var tr = $("<tr/>");
      tr.append("<td>" + tds.eq(0).text() + "</td>");
      tr.append("<td>" +...