title: Is there a simple way using CSS or Javascript to change the background color of a div based on the value of a field
body: <p>What I'm attempting to do is have the background of a div change from white to a very light green based on the results of a value returned from MySQL.  So I have a form that has a field called payment status, if they are paid in full I want the background color of the div to change to  light green. If payment displays no payment I want the background to display a very light red. </p>
  
  <p>I did a search and attempted using this <a href="https://stackoverflow.com/questions/13970902/can-i-make-a-div-change-its-background-color-based-on-the-value-inside-it">change background color based on value</a></p>
  
  <p>but it's a bit too complicated for me. I was hoping I could do this with javascript or css or a combination. 
  This is my line of code for the payment status <code>&lt;td&gt;Payment : &lt;/td&gt;
      &lt;td style="height: 30px; width: 145px;"&gt;&lt;?php echo $data2['pay_status']?&gt;&lt;/td&gt;</code></p>
  
  <p>so based on the value of pay_status is what I want to use to change the background color.</p>
  
  <p>*******UPDATE********
  So after a lot of trial and error I've come up with this <a href="http://jsfiddle.net/nG3VF/2/" rel="nofollow noreferrer">jsfiddle</a>
  This works like a charm if I needed to change the background color of an input box but I need to change the div background color? can someone help me modify this to change the div instead of the input box?</p>