JSFiddle - React, Tailwind, and code Playground

HTML

<div id="journey">
    <div class="square">Availability: 0 hostName: aaa Intranet: ttt timeResponse: 0.124</div>
    <div class="square">Availability: 0 hostName: qqq Intranet: hhh timeResponse: 0.064</div>
    <div class="square"></div>
</div>

JavaScript

var sampleResponse = [
    // availability, hostname, intranet, timeresponse
    [0, "aaa", "ttt", 0.124],
    [0, "qqq", "hhh", 0.064],
    [0, "www", "nnn", 0.303],
];
    
// Call following function
processResponse(sampleResponse);

function processResponse (rows) {
  // Get all squares and iterate over each
  $("#journey > .square").each( function(i) {
    console.log("Looking at square: " + i);
    var row = rows[i];
    var availability = row[0];
    var hostName = row[1];
    var intranet = row[2];
    var timeResponse = row[3];

var text = "Availability: " + availability + " hostName: " + hostName + " Intranet: " + intranet + " timeResponse: " + timeResponse;

    if ( $(this).text() != text ){
      $(this).html(text).css("border", "3px double red")
     }

  });
}