jQuery datepicker next/prev images

Question

I'm trying to set custom images for next / prev month buttons. I tried to use prevText / nextText options of datepicker to put span with my own css class definition, but it adds it to links title, so it's invalid HTML.

I don't want to change .ui-icon-circle-triangle-w and .ui-widget-header .ui-icon rules in jQuery UI CSS...i just want to add / change the class for rendered span element that is inside of a.

Solution

Contain your datepicker in a custom ID or class, then change the background on the .ui-icon class:

#my-calendar-id .ui-datepicker-next .ui-icon  {background:url('my_image'); }

Specificity is key when working with the jQuery UI CSS stack.