<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<span>29.03.2018</span><br>
<span>30.03.2018</span><br>
<span>31.03.2018</span><br>
<span>01.04.2018</span><br>
<span>02.04.2018</span><br>
<span>03.04.2018</span><br>
<span>04.04.2018</span><br>
<script>
var now = Date.now(),
color = ['#F00','#F70','#D90','#AA0','#5D0','#0F0'];
[].forEach.call(document.querySelectorAll('span'), function(el){
date = Date.parse(el.textContent.replace(/(\d+)\.(\d+)\.(\d+)/, '$2/$1/$3'));
var ost = (date - now)/86400000|0;
ost = ost >= 5 ? 5 : ost<0 ? 0 : ost;
el.style.color = color[ost];
});
</script>
</body>
</html>
поправил чутка для практичности