title: DataTables.js Sort columns containing HTML links with integer text
body: <p>I'm trying to sort columns in <a href="https://datatables.net" rel="nofollow" title="DataTables (table plug-in for jQuery">DataTables.js</a> that contain HTML anchor tags. The text within the anchor tag is an integer, like <code>&lt;a href="#"&gt;123&lt;/a&gt;</code>. I want to sort the columns numerically.</p>
  
  <p>In the documentation examples, there is <a href="http://datatables.net/release-datatables/examples/plug-ins/html_sort.html" rel="nofollow">DataTables HTML sorting auto-detection example</a>. I tried this but it doesn't solve my issue - it does correctly parse the text out of the HTML, however, it treats the resulting text as a string and not an integer. </p>
  
  <p>Example output:</p>
  
  <pre><code>0, 0, 1, 14, 67, 67, 7
  </code></pre>
  
  <p>Desired output:</p>
  
  <pre><code>0, 0, 1, 7, 14, 67, 67
  </code></pre>
  
  <p>How can I parse the <code>&lt;a&gt;</code> text as an integer prior to sorting?</p>
  
  <h1>Code</h1>
  
  <h2>JSFiddle</h2>
  
  <p>This is original JSFiddle without above update(s):
  <a href="http://jsfiddle.net/adamtsiopani/V4Ymr/" rel="nofollow">http://jsfiddle.net/adamtsiopani/V4Ymr/</a></p>
  
  <h2>JavaScript</h2>
  
  <pre><code>$(document).on('ready', function() {
      $('.data-table').dataTable({
          "bPaginate": true,
          "bFilter": true,
          "bSort": true,  
          "bAutoWidth": false,
          "iDisplayLength": 100,
          "sPaginationType": "full_numbers",
          "sDom": '&lt;"tools"T&gt;&lt;"top"flip&gt;rt&lt;"bottom"lfip&gt;&lt;"clear"&gt;',
          "oTableTools": {
              "aButtons": [
                  "copy", "csv", "xls", "pdf",
                  {
                      "sExtends":    "collection",
                      "sButtonText": "Save",
                      "aButtons":    [ "csv", "xls", "pdf" ]
                  }
              ]
          }
      });
  
      $.fn.dataTableExt.aTypes.push(
          function ( sData ) {
              return 'html';
          }
      );
  
  });
  </code></pre>
  
  <h2>HTML</h2>
  
  <pre><code>&lt;table class="data-table"&gt;
      &lt;thead&gt;
              &lt;tr&gt;
              &lt;th scope="col"&gt;Specialty&lt;/th&gt;
              &lt;th scope="col"&gt;Friday&lt;br&gt;21/01/2011&lt;/th&gt;
              &lt;th scope="col"&gt;Saturday&lt;br&gt;22/01/2011&lt;/th&gt;
              &lt;th scope="col"&gt;Sunday&lt;br&gt;23/01/2011&lt;/th&gt;
              &lt;th scope="col"&gt;Monday&lt;br&gt;24/01/2011&lt;/th&gt;
              &lt;th scope="col"&gt;Tuesday&lt;br&gt;25/01/2011&lt;/th&gt;
              &lt;th scope="col"&gt;Wednesday&lt;br&gt;26/01/2011&lt;/th&gt;
              &lt;th scope="col"&gt;Thursday&lt;br&gt;27/01/2011&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
          &lt;tr&gt;
              &lt;td&gt;&lt;a href="#"&gt;ACCIDENT AND EMERGENCY&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;5&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;14&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;67&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;45&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;43&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;28&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;36&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;&lt;a href="#"&gt;ANAESTHETICS&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;36&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;5&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;14&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;43&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;28&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;67&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;45&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;&lt;a href="#"&gt;CARDIOLOGY&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;5&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;14&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;67&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;45&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;43&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;28&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;36&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;&lt;a href="#"&gt;HEPATOLOGY&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;2&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;1&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;1&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;1&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;1&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;&lt;a href="#"&gt;GASTROENTEROLOGY&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;4&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;7&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;2&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;&lt;a href="#"&gt;PLASTIC SURGERY&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;6&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;8&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;16&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;5&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;4&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;&lt;a href="#"&gt;UROLOGY&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;3&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;0&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;1&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;&lt;a href="#"&gt;2&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>