JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<table class="container cf">
  <thead class="cf">
    <tr>
      <th class="numeric">amount <i class="glyphicon glyphicon-triangle-bottom"></i></th>
      <th class="numeric">case <i class="glyphicon glyphicon-triangle-bottom"></i></th>
      <th class="numeric">field 3 <i class="glyphicon glyphicon-triangle-bottom"></i></th>
      <th class="numeric">field 4 <i class="glyphicon glyphicon-triangle-bottom"></i></th>
      <th class="numeric">location <i class="glyphicon glyphicon-triangle-bottom"></i></th>
      <th class="numeric">date <i class="glyphicon glyphicon-triangle-bottom"></i></th>
    </tr>
  </thead>
  <tbody class="verdicts">
    <tr>
      <td data-title="amount" class="amount">8,570,000.00<span class="result"></span></td>
      <td data-title="case">title</td>
      <td data-title="practice area">area</td>
      <td data-title="user">Bob jones</td>
      <td data-title="location">Orlando, FL</td>
      <td data-title="date">Mar 6, 2017</td>
    </tr>
    <tr>
      <td data-title="amount" class="amount">$447,115<span class="result"></span></td>
      <td data-title="case">Another title</td>
      <td data-title="practice area">area</td>
      <td data-title="user">Joe Smith</td>
      <td data-title="location">Orlando, FL</td>
      <td data-title="date">Mar 6, 2017</td>
    </tr>
  </tbody>
</table>

CSS

.numeric-active {
  color: red;
}
.rotate {
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
}

JavaScript

$(".numeric").click(function() {
  $(".numeric").removeClass('numeric-active');
  $(this).toggleClass("numeric-active");
  $(this).find('i').toggleClass("rotate");
});