JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://datatables.net/download/build/jquery.dataTables.js"></script>
<table class="table-data natural-desc" border="1" style="white-space: nowrap; padding: 3px;">
    <thead>
        <tr>
            <th class="" style="width: 0px;"> Address 1</th>
            <th class="" style="width: 0px;"> Address 2</th>
            <th class="" style="width: 0px;"> Address 3</th>
            <th class="" style="width: 0px;"> Town or City</th>
            <th class="" style="width: 0px;"> Post Code</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td class=""><a href="ViewServiceRequest.aspx?RequestID=100090917486"> 10 PENN GROVE </a></td>
            <td></td>
            <td></td>
            <td> NORWICH </td>
            <td class=""> NR3 3JL </td>
        </tr>
        <tr>
            <td class=""><a href="ViewServiceRequest.aspx?RequestID=100090917488"> 12 PENN GROVE </a></td>
            <td></td>
            <td></td>
            <td> NORWICH </td>
            <td class=""> NR3 3JL </td>
        </tr>
        <tr>
            <td class=""><a href="ViewServiceRequest.aspx?RequestID=100090917490"> 14 PENN GROVE </a></td>
            <td></td>
            <td></td>
            <td> NORWICH </td>
            <td class=""> NR3 3JL </td>
        </tr>
        <tr>
            <td class=""><a href="ViewServiceRequest.aspx?RequestID=100090917492"> 16 PENN GROVE </a></td>
            <td></td>
            <td></td>
            <td> NORWICH </td>
            <td class=""> NR3 3JL </td>
        </tr>
        <tr>
            <td class=""><a href="ViewServiceRequest.aspx?RequestID=100090917478"> 2 PENN GROVE </a></td>
            <td></td>
            <td></td>
            <td> NORWICH </td>
            <td class=""> NR3 3JL </td>
        </tr>
        <tr>
            <td class=""><a href="ViewServiceRequest.aspx?RequestID=100090917496"> 20 PENN GROVE </a></td>
            <td></td>
            <td></td>
            <td> NORWICH </td>
          ...

JavaScript

/*
 * Natural Sort algorithm for Javascript - Version 0.6 - Released under MIT license
 * Author: Jim Palmer (based on chunking idea from Dave Koelle)
 * Contributors: Mike Grier (mgrier.com), Clint Priest, Kyle Adams, guillermo
 */

function naturalSort(a, b) {
    var re = /(^-?[0-9]+(\.?[0-9]*)[df]?e?[0-9]?$|^0x[0-9a-f]+$|[0-9]+)/gi,
        sre = /(^[ ]*|[ ]*$)/g,
        dre = /(^([\w ]+,?[\w ]+)?[\w ]+,?[\w ]+\d+:\d+(:\d+)?[\w ]?|^\d{1,4}[\/\-]\d{1,4}[\/\-]\d{1,4}|^\w+, \w+ \d+, \d{4})/,
        hre = /^0x[0-9a-f]+$/i,
        ore = /^0/,
        // convert all to strings and trim()
        x = a.toString().replace(sre, '') || '',
        y = b.toString().replace(sre, '') || '',
        // chunk/tokenize
        xN = x.replace(re, '\0$1\0').replace(/\0$/, '').replace(/^\0/, '').split('\0'),
        yN = y.replace(re, '\0$1\0').replace(/\0$/, '').replace(/^\0/, '').split('\0'),
        // numeric, hex or date detection
        xD = parseInt(x.match(hre)) || (xN.length != 1 && x.match(dre) && Date.parse(x)),
        yD = parseInt(y.match(hre)) || xD && y.match(dre) && Date.parse(y) || null;
    // first try and sort Hex codes or Dates
    if (yD) if (xD < yD) return -1;
    else if (xD > yD) return 1;
    // natural sorting through split numeric strings and default strings
    for (var cLoc = 0, numS = Math.max(xN.length, yN.length); cLoc < numS; cLoc++) {
        // find floats not starting with '0', string or 0 if not defined (Clint Priest)
        oFxNcL = !(xN[cLoc] || '').match(ore) && parseFloat(xN[cLoc]) || xN[cLoc] || 0;
        oFyNcL = !(yN[cLoc] || '').match(ore) && parseFloat(yN[cLoc]) || yN[cLoc] || 0;
        // handle numeric vs string comparison - number < string - (Kyle Adams)
        if (isNaN(oFxNcL) !== isNaN(oFyNcL)) return (isNaN(oFxNcL)) ? 1 : -1;
        // rely on string comparison if different types - i.e. '02' < 2 != '02' < '2'
        else if (typeof oFxNcL !== typeof oFyNcL) {
            oFxNcL += '';
            oFyNcL += '';
  ...