title: Change colour of table cells depending on value
body: <p>I'm using jQuery to edit the <code>background-color</code> of table cells. My code is as follows (the each cell has numbers in the format "x/y" so I mine them out at the start):</p>
  
  <pre><code>        $(document).ready(function(){
              $("#overview td").click(function(event){
  
                  var content = $(this).html();
                  var vals = content.split("/");
                  var ratio = vals[0]/vals[1];
                  alert(ratio);
  
  
                  var red;
                  var green;
  
                  if(vals[1] == 0){
                      $(this).css('background-color', '#00FF00');
                  } else{
                      if(ratio &gt; 0.5){
                          red = 255;
                          green = parseInt(-2*255*ratio+(2*255));
                      } else{
                          green = 255;
                          red = parseInt(2*255*ratio);
                      }   
                      var rgbColor = 'rgb(' + red + ',' + green+ ', 0)';
                      var hexColor = rgb2hex(rgbColor);
                      $(this).css('background-color', hexColor);
                  }
              });
          });
  </code></pre>
  
  <p>Now this works when I click on each individual cell, but I would like to colour all of the cells on <code>$(document).ready()</code>. I think the <code>.each()</code> method may be what I'm looking for, but I can't figure out how to make it work properly...</p>
  
  <p>Any help would be greatly appreciated!</p>