title: sorting html table with jquery
body: <p>I have a table in html, I have set for each td an id that I will need to sort the table with a Jquery code. </p>
  
  <p>Sorting works with the FireFox browser, but with Chrome it does not work ... do you know how to help me?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(function() {
  
    $(".table-user-th").click(function() {
      var o = $(this).hasClass('asc') ? 'desc' : 'asc';
      $('.table-user-th').removeClass('asc').removeClass('desc');
      $(this).addClass(o);
  
      var colIndex = $(this).prevAll().length;
      var tbod = $(this).closest("table").find("tbody");
      var rows = tbod.find("tr");
  
      rows.sort(function(a, b) {
        var A = $(a).find("td").eq(colIndex).attr('id');;
        var B = $(b).find("td").eq(colIndex).attr('id');;
  
        if (!isNaN(A)) A = Number(A);
        if (!isNaN(B)) B = Number(B);
  
        return o == 'asc' ? A &gt; B : B &gt; A;
      });
  
      $.each(rows, function(index, ele) {
        tbod.append(ele);
      });
    });
  
  
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;table border="1"&gt;
    &lt;thead&gt;
      &lt;tr&gt;
        &lt;th class="table-user-th"&gt;Firstname&lt;/th&gt;
        &lt;th class="table-user-th"&gt;Lastname&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;
      &lt;tr&gt;
        &lt;td id="Mark"&gt;Mark&lt;/td&gt;
        &lt;td id="Red"&gt;Red&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
        &lt;td id="Nick"&gt;Nick&lt;/td&gt;
        &lt;td id="Sid"&gt;Sid&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
        &lt;td id="Alex"&gt;Alex&lt;/td&gt;
        &lt;td id="Nirv"&gt;Nirv&lt;/td&gt;
      &lt;/tr&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>