Question about $(this).data

Question about $(this).data

I'm making color swatches to click on to change the color of a piece of text. A swatch looks like this:

  1. <div class="Color" data-color="IndianRed"></div>
When the swatch is clicked, a selected div gets its text colored "IndianRed" by this code:

  1. $('.Color').click(function(ChangeColor){
    $('.selected').css('color', $(this).data('color'))
    });


which works nicely.

Now I thought it would be nice to set the background-color of the swatches when the page loads in a similar way, and you don't have to add something like style="background-color:IndianRed;"     to all your divs.

 So I wrote:

  1. {
    $('.Color').css('background-color', $(this).data('color'))
    };



Which doesn't work. Why?? What am I missing? Because

  1. {
    $('.Color').css('background-color', 'IndianRed')
    };



will paint all swatches IndianRed when the page loads.