Highlight first day of every month in jQuery UI Datepicker

With continuation of jQuery UI Datepicker series articles, here is another post which gives solution to highlight very first day of each month in jQuery UI Datepicker control.

First, define a CSS class to show highlighted effect.

.firstDay a{
   background-color : #00FF00 !important;
   background-image :none !important;
   color: #000 !important;
}

And use "beforeShowDay" event provided with jQuery UI Datepicker control which gets called before building the control. This event can be used to assign specific class to specific dates.

$(document).ready(function () {
    $("#txtDate").datepicker({
        beforeShowDay: function (date) {
            return [true, date.getDate() == 1 ? "firstDay" : ""];
        }
    });
});

See Complete Code

Feel free to contact me for any help related to jQuery, I will gladly help you.