JSFiddle - React, Tailwind, and code Playground

HTML

<table id="sort-table">
    <tbody>
<tr><td>Text 2003-01-27.pdf</td></tr>
<tr><td>Text 2004-03-23.pdf</td></tr>
<tr><td>Text 2004-04-01.pdf</td></tr>
<tr><td>Text 2004-12-31.pdf</td></tr>
<tr><td>Text 2010-04-14.pdf</td></tr>
<tr><td>Text 2011-02-07.pdf</td></tr>
<tr><td>Medic 2004-08-24.pdf</td></tr>
<tr><td>Bank 2009-10-06.pdf</td></tr>
<tr><td>Family 2010-10-19.pdf</td></tr>
<tr><td>Statement 2002-03-06.pdf</td></tr>
<tr><td>Statement 2002-03-06.pdf</td></tr>
<tr><td>Statement 2004-06-30.pdf</td></tr>
<tr><td>Statement 2010-03-31.pdf</td></tr>
<tr><td>Next.pdf</td></tr>
<tr><td>School 2002-03-04.pdf</td></tr>
<tr><td>School 2003-06-23.pdf</td></tr>
<tr><td>School 2010-06-10.pdf</td></tr>
<tr><td>Deal 2002-03-04.pdf</td></tr>
<tr><td>Deal 2002-06-03.pdf</td></tr>
<tr><td>Deal 2003-06-03.pdf</td></tr>
<tr><td>Vacation 2009-08-10.pdf</td></tr>
<tr><td>Vacation 2007-03-26.pdf</td></tr>
<tr><td>Vacation 2009-08-10.pdf</td></tr>
<tr><td>Vacation 2008-03-19.pdf</td></tr>
<tr><td>Vacation 2009-03-23.pdf</td></tr>
<tr><td>Vacation 2012-09-21.pdf</td></tr>
<tr><td>Vacation 2012-09-17.pdf</td></tr>
<tr><td>Vacation 2014-09-25.pdf</td></tr>
<tr><td>Vacation 2014-10-23.pdf</td></tr>
<tr><td>Work 2004-06-21.pdf</td></tr>
<tr><td>Work 2009-09-09.pdf</td></tr>
<tr><td>Work 2010-05-01.pdf</td></tr>
<tr><td>AGR 2002-03-05.pdf</td></tr>
<tr><td>AGR 2004-10-28.pdf</td></tr>
<tr><td>AGR 2005-11-22.pdf</td></tr>
<tr><td>AGR 2011-01-20.pdf</td></tr>
    </tbody>
</table>
<br>
<button class="sort-table asc">sort ASC</button>
<button class="sort-table desc">sort DESC</button>

JavaScript

$('.sort-table').click(function(e) {
    e.preventDefault();                        // prevent default button click behaviour

    var sortAsc = $(this).hasClass('asc'),     // ASC or DESC
        $table  = $('#sort-table'),            // cache the target table DOM element
        $rows   = $('tbody > tr', $table);     // cache all rows from the target table body

    $rows.sort(function(a, b) {

        var keyA = $('td',a).text();
        var keyB = $('td',b).text();

        if (sortAsc) {
            return (keyA > keyB) ? 1 : 0;     // A bigger than B, sorting ascending
        } else {
            return (keyA < keyB) ? 1 : 0;     // B bigger than A, sorting descending
        }
    });

    $rows.each(function(index, row){
      $table.append(row);                    // append rows after sort
    });
});