JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<table id="codexpl">
  <tr>
    <th>#</th>
    <th>Title</th>
    <th>Date</th>
  </tr>
  <tr>
    <td>1</td>
    <td>Cake</td>
    <td>01-05-2016</td>

  </tr>
  <tr>
    <td>2</td>
    <td>Pizza</td>
    <td>06-06-2016</td>

  </tr>
  <tr>
    <td>3</td>
    <td>Bread</td>
    <td>06-02-2016</td>

  </tr>
  <tr>
    <td>4</td>
    <td>Egg</td>
    <td>06-01-2016</td>

  </tr>
  <tr>
    <td>5</td>
    <td>Fish</td>
    <td>01-05-2016</td>

  </tr>
</table>

CSS

th {
   background-color: grey;
   font-weight: bold;
 }

JavaScript

var _MS_PER_DAY = 1000 * 60 * 60 * 24;

// a and b are javascript Date objects
function dateDiffInDays(a, b) {
  // Discard the time and time-zone information.
  var utc1 = Date.UTC(a.getFullYear(), a.getMonth(), a.getDate());
  var utc2 = Date.UTC(b.getFullYear(), b.getMonth(), b.getDate());
  return Math.floor((utc2 - utc1) / _MS_PER_DAY);
}


$('table td:nth-child(3)').each(function() {
  var selectedDate = new Date($(this).text());
  var currentDate = new Date();
  var daysDiff = dateDiffInDays(currentDate, selectedDate);

  if (daysDiff < 0) {
    $(this).css('backgroundColor', 'red');
  } else if (daysDiff < 7 && daysDiff > 4) {
    $(this).css('backgroundColor', 'yellow');
  } else {
    $(this).css('backgroundColor', 'blue');
  }

});
event.preventDefault();