动态更改实时更新，无需刷新页面

I am working on a project at the moment. In iI am using ajax to update and calculate scores, which works fine. However, I have a color scheme that changes according to the score. The color does change, but only after the page is refreshed. Is there anyway I can get the color to change with refreshing the page?

Here is the code that I am using to assign colors:

 <?php $row_class = "";
    while($row = mysql_fetch_assoc($dbResult1))
    {
          if($row['total_mai'] <= 2)
             $row_class = "success";
          else if($row['total_mai'] >= 5)
               $row_class = "danger";
          else if($row['total_mai'] >= 3 and $row['total_mai'] < 5)
               $row_class = "warning";

          // echo $row_class;
    ?>

In another page, here is an example of one question, it has three answers and depending on the answer a color is assigned based on the score

<tr>
   <td class="form-group col-md-6">Is the duration of therapy acceptable?</td>
   <td class="form-group col-md-6">
       <p class="radio-inline">
       <input type="radio" name="therapydur" id="j1" value="0" <?php echo $j1; ?> required onchange="ajaxFunction('therapydur','<?php echo $count; ?>','0','<?php echo $row['p_id']; ?>')">
       <a href="#" data-toggle="tooltip" data-placement="top" title="acceptable">A</a>
       </input></p>

       <p class="radio-inline">
       <input type="radio" name="therapydur" id="j2" value="0" <?php echo $j2; ?> required onchange="ajaxFunction('therapydur','<?php echo $count; ?>','0','<?php echo $row['p_id']; ?>')">
       <a href="#" data-toggle="tooltip" data-placement="top" title="marginally acceptable">B</a>
       </input></p>

       <p class="radio-inline">
       <input type="radio" name="therapydur" id="j3" value="1" <?php echo $j3; ?> required onchange="ajaxFunction('therapydur','<?php echo $count; ?>','1','<?php echo $row['p_id']; ?>')">
       <a href="#" data-toggle="tooltip" data-placement="top" title="unacceptable">C</a>
       </input></p>
   </td>
   </tr>

Here is the ajax from the same page:

    <script language="javascript" type="text/javascript">


    function ajaxFunction(title,id,val,p_id)
    {
             //alert("test");
             //alert(id);
             //alert(val);
             //alert(title);
             //alert(p_id);
             var xmlhttp;
             if (window.XMLHttpRequest)
             {// code for IE7+, Firefox, Chrome, Opera, Safari
                 xmlhttp=new XMLHttpRequest();
             }
             else
             {// code for IE6, IE5
                 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
             }
             xmlhttp.onreadystatechange=function()
             {
                   if (xmlhttp.readyState==4 && xmlhttp.status==200)
                   {
                      //alert(xmlhttp.responseText);
                      var resp = xmlhttp.responseText;
                      var split_v = resp.split("__");
                      //alert(split_v.length);
                      //alert(split_v[1]);
                      document.getElementById("ajaxDiv_"+id).innerHTML=split_v[0];
                      document.getElementById("ajaxTotal").innerHTML=split_v[1];

                   }
             }

             xmlhttp.open("GET","ajax_mai.php?pdr_id="+id+"&value="+val+"&title="+title+"&p_id="+p_id,true);
             xmlhttp.send();
             return true;
    }

    </script>