Apply random color to class elements individually?

Question

My goal is to each div with a class of "main" to have a random background color. I have the script that generates the random color but, using jquery, I only seem to be able to apply it to all divs in the class. How can I select a div, apply the color, select the next div in the class, generate a new random color, apply it and repeat? Here's my code:

$(document).ready(function() {
    var hue = 'rgb(' + (Math.floor((256-199)*Math.random()) + 200) + ','
                     + (Math.floor((256-199)*Math.random()) + 200) + ','
                     + (Math.floor((256-199)*Math.random()) + 200) + ')';
    $('.main').css("background-color", hue);
});

Answer 1

The code should be something like this...

$(document).ready(function() {
                        $('.main').each{ Function(){
                             $(this).css("background-color", hue); };
                        };
                });

Bah- sorry for the mistakes. Fixed the worst of them for my own sanity's sake.. but the other answer beat me to it.

Answer 2

$(document).ready(function() {
    $('.main').each(function () {
     var hue = 'rgb(' + (Math.floor((256-199)*Math.random()) + 200) + ',' + (Math.floor((256-199)*Math.random()) + 200) + ',' + (Math.floor((256-199)*Math.random()) + 200) + ')';
     $(this).css("background-color", hue);
    });
});

Answer 3

$(document).ready(function() {
  $('.main').each(function(){
    var hue = 'rgb(' + (Math.floor((256-199)*Math.random()) + 200) + ',' + 
      (Math.floor((256-199)*Math.random()) + 200) + ',' + 
      (Math.floor((256-199)*Math.random()) + 200) + ')';
    $(this).css("background-color", hue);
  }
});