JSFiddle - React, Tailwind, and code Playground

by jfriend00

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css">
<div id="startDate"></div>
<div id="endDate"></div>
<div><button id="calc">Calc Number of Business Days</button></div>
<div id="diff"></div>

JavaScript

function calcBusinessDays(start, end) {
    // This makes no effort to account for holidays
    // Counts end day, does not count start day

    // make copies we can normalize without changing passed in objects    
    var start = new Date(start);
    var end = new Date(end);
    
    // initial total
    var totalBusinessDays = 0;
    
    // normalize both start and end to beginning of the day
    start.setHours(0,0,0,0);
    end.setHours(0,0,0,0);
    
    var current = new Date(start);
    current.setDate(current.getDate() + 1);
    var day;
    // loop through each day, checking
    while (current <= end) {
        day = current.getDay();
        if (day >= 1 && day <= 5) {
            ++totalBusinessDays;
        }
        current.setDate(current.getDate() + 1);
    }
    return totalBusinessDays;
}

$("#startDate, #endDate").datepicker();

$("#calc").click(function(e) {
    var diff = calcBusinessDays(
        $("#startDate").datepicker("getDate"), 
        $("#endDate").datepicker("getDate")
    );
    $("#diff").html(diff);
});