JSFiddle - React, Tailwind, and code Playground
HTML
<table>
<thead>
<tr>
<td>date1</td>
<td>date2</td>
<td>Result</td>
<td>Expected</td>
</tr>
</thead>
<tbody>
<tr>
<td>01/12/2014</td>
<td>02/24/2014</td>
<td></td>
<td>true</td>
</tr>
<tr>
<td>01/12/2013</td>
<td>02/24/2012</td>
<td></td>
<td>false</td>
</tr>
<tr>
<td>01/12/2014</td>
<td>02/24/2018</td>
<td></td>
<td>true</td>
</tr>
<tr>
<td>01/12/2015</td>
<td>02/24/2011</td>
<td></td>
<td>false</td>
</tr>
</tbody>
</table>
CSS
table{
border-collapse: collapse;
}
td{
padding: 5px;
border: 1px solid #000;
}
JavaScript
function dateCompare(date1, date2){
return new Date(date2) > new Date(date1);
}
// Demo (uses jQuery)
$("tbody tr").each(function(){
$tr = $(this);
$td = $tr.children('td');
date1 = $td.eq(0).text();
date2 = $td.eq(1).text();
result = dateCompare(date1,date2);
$td.eq(2).text(result);
if($td.eq(2).text() == $td.eq(3).text()) $tr.css('background','green');
else $tr.css('background','red');
});