jQuery UI datepicker - add static text underneath the calendar?

Question

This is on the one that pops up when you click the linked input element. I want to be able to insert some static text underneath the table of dates that will appear and stay

Answer 1

One solution for presenting different texts on multiple datepickers on the same page is to create data holders next to the id/class space of each datepicker location. Then load the data content for the datepicker selected using (this).

Example html code: The data holder contains the specific text to be displayed for the associated datepicker like so:

Date1: 

Date2: 

Example jQuery code: Then the jQuery text injection into the selected datepicker calendar would be something like this:

$( ".datepicker" ).datepicker()
    .on( "click", function() {
        var dTxt = $( this ).data('dptxt');
    $('.ui-datepicker-calendar').after(''+dTxt+'');
});

I've added a little CSS formatting so that you can easily see the additional semi-dynamic text changing between the two datepickers.

See my working jsFiddle solution in action (images below from the jsFiddle link :)

_{(source: web-asylum.com)}