JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<p>Date1: <input type="text" class="datepicker" data-dptxt="the text1 to display in datepicker" ></p>

<p>Date2: <input type="text" class="datepicker" data-dptxt="the text2 to display in datepicker" ></p>
    
    
<div id="expln">
Quick code help by <a href="http://myrentals-tenerife.com">MyRentals</a>
<br>
    for StackOverflow question:
    <br>
    <strong>"jQuery UI datepicker - add static text underneath the calendar?"</strong>
<br><br>
http://stackoverflow.com/questions/3054854/jquery-ui-datepicker-add-static-text-underneath-the-calendar
</div>

CSS

.middle {
    text-align: center;
    width: 100%;
    background-color: yellow;
    display: inline-block;
}
#expln {
    font-family: Arial;
    font-size: 0.8em;
    margin: 160px 0 0;
}

JavaScript

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