• I have one datepicker with numberOfMonths set to 2.
• Arrival Date and Departure Date are determined using this logic (within onSelect):

if ((count % 2)==0) {
      depart = $("#datepicker-1").datepicker('getDate');
      if (arriv > depart) { temp=arriv; arriv=depart; depart=temp; }
      $("#check-in").val($.datepicker.formatDate("DD, MM d, yy",arriv)); 
      $("#check-out").val($.datepicker.formatDate("DD, MM d, yy",depart));
     } else {
      arriv = $("#datepicker-1").datepicker('getDate');
      depart = null;
      if ((arriv > depart)&&(depart!=null)) { temp=arriv; arriv=depart; depart=temp; }
      $("#day-count").val('');
      $("#check-in").val($.datepicker.formatDate("DD, MM d, yy",arriv));
      $("#check-out").val($.datepicker.formatDate("DD, MM d, yy",depart));
     }

     if(depart!=null) { 
      diffDays = Math.abs((arriv.getTime() - depart.getTime())/(oneDay)); 
      if (diffDays == 0) { $("#day-count").val((diffDays+1)+' Night/s'); } else { $("#day-count").val(diffDays+' Night/s'); }
     }

• Getting the number of days within these 2 dates has no problem
• What I want now is highlight those dates starting from the Arrival to Departure
• I tried working around the onSelect but had no luck.
• I am now using beforeShowDay to highlight these dates but I can't seem to figure it out
• Got a sample from here
• Basically, it is customized to highlight 11 or 12 days after the selected date (Here's the code from that link).

    $('#datePicker').datepicker({beforeShowDay: function(date) {
                        if (selected != null && date.getTime() > selected.getTime() &&
                            (date.getTime() - selected.getTime()) 

• Since I am new to using the UI, and the logic is not clear to me yet, I can't seem to figure this out. Any ideas on how I can make this highlight dates between the Arrival and Departure using my aforementioned logic used in determining the two?