Jquery UI datepicker change background color for a day

Question

I am using Jquery UI datepicker and I am trying to change the background color for each day in a month.

For this I am using beforeShowDay function in Jquery UI date-picker.

As an example I am trying to change the background color for odd days in a month and my script changes only border color.

I am not sure where the mistake is, How do I over ride the entire back ground color in Jquery to achieve the desired result.

please help.

Script Used:

$(document).ready(function() {
    //$("#datepicker").datepicker();
    $("#datepicker").datepicker({ inline: true, beforeShowDay: highlightOdds});
  });

   function highlightOdds(date) {
      return [true, date.getDate() % 2 == 1 ? 'odd' : ''];
 }

Css Used:

.odd { background-color: green; }

Answer 1

hii All I found it myself,

I just modifed the css as given below and it works cool :)

.odd a.ui-state-default {color:white;
                         background-color: red;
                         background: red;}

thank u all :)