<script>
// *** CHECK FOR JQUERY 
!window.jQuery && document.write(unescape('%3Cscript src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"%3E%3C/script%3E'));

// when and how to fire this function ?
// rather than event bubblers for individual changes, thinking bog standard time loop ....
// in that way we can ignore ajax and in max two loops any font colour will be correct
// and we save a lot of processor work !

$(document).ready(function(){
  var runwithit = setInterval(checkTemp, 400); // only required for dynamic content
// else (static content) ..
// checkTemp();
});

function checkTemp() {
    $(".Tcol").each(function() { // function[1]
        bert = parseInt($(this).html(), 10); // NB only looks for a number in FIRST position of string
        if(bert !== false) {; // allow zero
// you can change logic to suit purpose (eg. unit converion of data)
// modifying PARENT background-color / color (background is the 'temp' colour, text is contrasted)
            bulk = {'background-color' : '#FFFFFF', 'color' : '#000000'}; // 'out of range' default values
// 'look-up' for INT values
// CUSTOM colours / range [-50 => +50] (the beteljuices choice)

// Put in array - do value check for font colour
//                 -50        -49        -48       -47      -46         -45       -44      -43       -42      -41
    lookUpBg = ['#3d0060','#400067','#44006e','#470075','#4b007c','#4f0083','#52008b','#560092','#5a0099','#5d00a0',
                '#6100a7','#6900af','#7200b8','#7b00c1','#8400ca','#8d00d3','#9600dc','#9f00e5','#a800ee','#b100f7',
                '#ba00ff','#a700f4','#9400e9','#8100df','#6e00d4','#5c00c9','#4900bf','#3600b4','#2300aa','#10009f',
                '#000096','#080896','#101097','#191898','#212099','#2a289a','#32309b','#3b389c','#43409d','#4c489e',
                '#54509f','#4b61a4','#4373a9','#3a85af','#3296b4','#29a8b9','#21babf','#18cbc4','#10ddc9','#07efcf',
//                  0         1         2          3        4         5          6         7         8         9
                '#00ffd4','#07ffbe','#0effa9','#15ff93','#1dff7e','#24ff68','#2bff53','#32ff3e','#3aff28','#41ff13',
                '#48ff00','#5afb00','#6cf800','#7ff400','#91f100','#a4ed00','#b6ea00','#c9e600','#dbe300','#eee000',
                '#ffdd00','#ffc600','#ffb000','#ff9a00','#ff8300','#ff6d00','#ff5700','#ff4000','#ff2a00','#ff1400',
                '#ff0000','#f80000','#f10000','#ea0000','#e30000','#dd0000','#d60000','#cf0000','#c80000','#c20000',
                '#bc0000','#b30000','#aa0000','#a10000','#980000','#8f0000','#860000','#7d0000','#740000','#6c0000',
                '#640000'
            ];

            agatha = bert+50;
            if(lookUpBg[agatha]) {
                if((bert >= -50 && bert <= -4) || (bert >= 24 && bert <= 50)) { // contrast text
                    col = "#FFFFFF";
                } else {
                    col = "#000000";
                }
                bulk = {'background-color' : lookUpBg[agatha], 'color' : col};
            }

// change background of PARENT element !!! ie. enclosing element ... this should cope with constructs if used carefully
            $(this).parent().css(bulk); // or for single value pair ('background-color', col)

        } // end if bert
    }); // end function[1]
 }; // end function checkTemp

</script>