Date filter for HTML Table

Following HTML table has Start Date and End Date in different columns and if we need to filter the rows between these dates with the help of a date picker.

<table class="table table-striped mt32 customers-list" id="tableData">
    <thead>
        <tr>
            <th width=40%> Name</th>
            <th>Internal Name</th>
            <th>Offer Code</th>
            <th width=30%>Start Date</th>
            <th width=30%>End Date</th>
        </tr>
    </thead>
    <tbody>
        <tr id="maintr">
            <td> Amazon Spring ADP 2020 -$5 Amazon GC </td>
            <td> PRDOFR168_livePERD </td>
            <td> SPRINGADPAMZ5GC2020 </td>
            <td> 22-JAN-20 </td>
            <td> 30-APR-20 </td>
        </tr>
        <tr id="maintr">
            <td> Indy Car Giveaway 2020 </td>
            <td> PRDOFR170 </td>
            <td> INDYCARSWEEP2020 </td>
            <td> 22-JAN-20 </td>
            <td> 15-APR-20 </td>
        </tr>
        <tr id="maintr">
            <td> Indy Car Giveaway 2020 </td>
            <td> PRDOFR170_livePERD </td>
            <td> INDYCARSWEEP2020 </td>
            <td> 22-JAN-20 </td>
            <td> 15-APR-20 </td>
        </tr>
        <tr id="maintr">
            <td> Test Offer 2 </td>
            <td> DEVOFR190 </td>
            <td> </td>
            <td> 29-JAN-20 </td>
            <td> </td>
        </tr>
        <tr id="maintr">
            <td> Test Offer 3 </td>
            <td> DEVOFR193 </td>
            <td> </td>
            <td> 29-JAN-20 </td>
            <td> </td>
        </tr>
    </tbody>
</table>

Script to filter date on 3 and 4 column

 <script>
const searchbyDate = () => {
    var startDateArr = [];
    var endDateArr = [];
    var myTab = document.getElementById('tableData');
    let InputStartDate = document.getElementById('date_input').value;
    let InputEndDate = document.getElementById('date_input2').value;
    // LOOP THROUGH EACH ROW OF THE TABLE AFTER HEADER.
    for(i = 1; i < myTab.rows.length; i++) {
        // GET THE CELLS COLLECTION OF THE CURRENT ROW.
        var objCells = myTab.rows.item(i).cells;
        var t1 = new Date(objCells.item(3).innerHTML)
        startDateArr.push(t1);
        var t2 = new Date(objCells.item(4).innerHTML)
        endDateArr.push(t2);
    }
    var startDate = new Date(InputStartDate);
    var endDate = new Date(InputEndDate);
    startDate.setHours(0, 0, 0, 0);
    endDate.setHours(0, 0, 0, 0);
    let myTable = document.getElementById('tableData');
    let tr = myTable.getElementsByTagName('tr');
    if(+startDate > +endDate) {
        alert("Select Valid Date. Now please Refresh this page to continue to run code.");
    } else {
        for(var j = 0; j < endDateArr.length; j++) {
            var temp1 = new Date(startDateArr[j]);
            var temp2 = new Date(endDateArr[j]);
            if(startDate && !InputEndDate) {
                if(+startDate <= +temp1 || +startDate === +temp1) {
                    tr[j + 1].style.display = "";
                } else {
                    tr[j + 1].style.display = "none";
                }
            } else if(!InputStartDate && endDate) {
                if(+endDate >= +temp2 || +endDate === +temp2) {
                    tr[j + 1].style.display = "";
                } else {
                    tr[j + 1].style.display = "none";
                }
            } else if(startDate && endDate) {
                if((+startDate <= +temp1 || +startDate === +temp1) && (+endDate >= +temp2 || +endDate === +temp2)) {
                    tr[j + 1].style.display = "";
                } else {
                    tr[j + 1].style.display = "none";
                }
            }
        }
    }
}