JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.github.com/padolsey/jQuery-Plugins/master/sortElements/jquery.sortElements.js"></script>
<table>
    <thead>
    <tr>
        <th id="facility_header">Facility name</th>
        <th>Phone #</th>
        <th id="city_header">City</th>
        <th>Speciality</th>
    </tr>
</thead>
    <tbody>
    <tr>
        <td><span></span></td>
        <td><span></span></td>
        <td><span>Amsterdam</span></td>
        <td><span>GGG</span></td>
    </tr>
    <tr>
        <td>JJJ</td>
        <td>55544444</td>
        <td>London</td>
        <td>MMM</td>
    </tr>
    <tr>
       <td><span></span></td>
        <td><span></span></td>
        <td><span>Amsterdam</span></td>
        <td><span>GGG</span></td>
    </tr>
</tbody>
</table>

CSS

td, th { border: 1px solid #111; padding: 6px; }
th { font-weight: 700; }

JavaScript

var table = $('table');

$('#facility_header, #city_header').css({
    'text-decoration': 'underline',
    'cursor': 'pointer'
}).wrapInner('<span title="sort this column"/>').each(function() {

    var th = $(this),
        thIndex = th.index(),
        inverse = false;

    th.click(function() {

        table.find('td').filter(function() {

            return $(this).index() === thIndex;

        }).sortElements(function(a, b) {

            return $.text([a]) > $.text([b]) ? inverse ? -1 : 1 : inverse ? 1 : -1;

        }, function() {

            // parentNode is the element we want to move
            return this.parentNode;

        });

        inverse = !inverse;

    });

});