JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="second" readonly="readonly" value="21/03/2011" style="">

<input type="text" id="first" readonly="readonly" value="29/08/2010" style="">

<input type="text" id="h" value="" style="color:#000">

<br/><br/>

<span id="health_strong"style="display:none;position:relative;top:-5px;height:18px;border-bottom:5px #c1d800 solid;font-size:10px;">HEALTH : STRONG  &nbsp; </span>
<span id="health_good"style="display:none;position:relative;top:-5px;height:18px;border-bottom:5px #c1d800 solid;font-size:10px;"> HEALTH : GOOD  &nbsp; </span>
<span id="health_ok"style="display:none;position:relative;top:-5px;height:18px;border-bottom:5px #ffa200 solid;font-size:10px;"> HEALTH : OK &nbsp; </span> 
<span id="health_bad"style="display:none;position:relative;top:-5px;height:18px;border-bottom:5px #e90000 solid;font-size:10px;"> HEALTH : BAD &nbsp;</span>

JavaScript

function parseDate(str) {
     var mdy = str.split('/')
     return new Date(mdy[2], mdy[1], mdy[0]);
 }
 function daydiff(first, second) {
     return (second-first)/(1000*60*60*24)
 }
var newVal = (daydiff(parseDate($('first').get('value')), parseDate($('second').get('value'))));    
 $('h').value = newVal;
 
window.addEvent('domready', function() {  
 if (newVal >= '275') { 
      $('health_strong').setStyle('display','block');    
     }
 else if (newVal >= '180') {
      $('health_good').setStyle('display','block');       
     }
 else if (newVal >= '90') {
      $('health_ok').setStyle('display','block');     
      }
 else if (newVal < '90') {
      $('health_bad').setStyle('display','block');
      $('health_alert').setStyle('display','block');       
      }
 });