JSFiddle - React, Tailwind, and code Playground

by David Marshall

HTML

<ul id='days'>
    <li>7/2 11:00 - 14:00 </li>
    <li>7/6 11:00 - 14:00</li>
    <li>7/7 11:00 - 14:00</li>
    <li>7/8 11:00 - 14:00</li>
    <li>7/9 11:00 - 14:00</li>
    <li>7/13 11:00 - 14:00 </li>
    <li>7/14 11:00 - 14:00</li>
</ul>
<ul id='formatdays'>
    
</ul>
<input type='button' id='change' value='Change format'/>

JavaScript

var weekday=["Mon","Tues","Wed","Thur","Fri","Sat","Sun"];
function days(t){
    var cd = 24 * 60 * 60 * 1000,
        ch = 60 * 60 * 1000,
        d = Math.floor(t / cd),
        h = Math.floor( (t - d * cd) / ch),
        m = Math.round( (t - d * cd - h * ch) / 60000);
  if( m === 60 ){
    h++;
    m = 0;
  }
  if( h === 24 ){
    d++;
    h = 0;
  }
  return d;
}
$('#change').on('click',function(){
    var dates=$('#days li');
    var newDates=[];
    var today=new Date();
    var current;
    dates.each(function(){
        var temp=$(this).text();
        current = new Date(temp.substring(0,temp.indexOf(' '))+'/'+today.getFullYear()+' '+temp.substring(temp.indexOf('- ')+2));
        console.log(temp.substring(temp.indexOf('- ')+2));
        if(newDates.length==0){
            newDates.push(new Date(current.getTime()));
        }else{
            var prev=newDates[newDates.length-1];
            //console.log(prev.toString());
            //console.log(days(current-prev));
            while(days(current-prev)>1){
                temp=new Date(prev.getTime());
                temp.setDate(prev.getDate() + 1);
                newDates.push(new Date(temp.getTime()));
                prev=newDates[newDates.length-1];
            }
            newDates.push(new Date(current.getTime()));
        }
        //console.log(JSON.stringify(newDates));
    });
    console.log(JSON.stringify(newDates));
    var d;
    for(i=0;i<newDates.length;i++){
       d=newDates[i]; $('#formatdays').append('<li>'+weekday[d.getDay()]+':('+(d.getUTCMonth()+1)+'/'+d.getDate()+')'++'</li>');
    }
});