dynamically change css for jquery datapicker

Question

How do I change datapicker look via jquery. I don't want to hide datapicker only ui-datepicker-calendar class.

It works:

   .ui-datepicker-calendar {
       display: none;
    }​

But this doesn't work:

      $(function() {
         $("#startdateMyWorkouts").datepicker({ dateFormat: 'dd-mm-yy' });
         $(".ui-datepicker-calendar").css('display','none');
    });

Answer 1

Try using, .datepicker("hide"). you could do it in an event. Here you are doing it in document load

By the way if you want this to happen in an event use the following way,

$(function() {
    $("#startdateMyWorkouts").datepicker({ dateFormat: 'dd-mm-yy',
        beforeShow: function(input, inst) {
           $("#datefilterMyWorkouts").change(function()) { // your select change event
              return false; // to hide the datepicker
           });
        } 
    });
});