Edit table Javascript and corresponding dates

I have this table:

I'm trying to insert the events I have in my database in a certain way: basically what i would like is to let the code to check the name of the events in my database (blue square) and associate the cells (above the red line) where I add manually my events with the same name. And at that point add the hour difference (between startDate and endDate) in the corresponding day of the month.

This is the code that render the header of my table (where it takes the current month and add every days of that month):

function renderHead(div, start, end) {
        var c_year = start.getFullYear();
        var r_year = "<tr>";
        var daysInYear = 0;
    
        var c_month = start.getMonth();
        var r_month = "<tr>";
        var daysInMonth = 0;
    
        var r_days = "<tr> <td id= 'event'> Eventi </td>";
        
        for (start; start <= end; start.setDate(start.getDate() + 1)) {
    
                if (start.getFullYear() !== c_year) {
                    r_year += '<td colspan="' + daysInYear + '">' + c_year + '</td>';
                    c_year = start.getFullYear();
                    daysInYear = 0;
                }
                daysInYear++;
    
                if (start.getMonth() !== c_month) {
                    r_month += '<td colspan="' + daysInMonth + '">' + months[c_month] + '</td>';
                    c_month = start.getMonth();
                    daysInMonth = 0;
                }
                daysInMonth++;
    
                r_days += '<td id="days">' + start.getDate() + '</td>'; 
        }
        
        r_days += " <td id='tot'> Totale </td> </tr>";
        r_year += '<td colspan="' + (daysInYear) + '">' + months[c_month] + ' '+ c_year +'</td>'; 
        r_year += "</tr>";
        
        table = "<table id='tblData' border='1'>" + r_year + r_days + "</table>"; 
    
        div.html(table);
    }
    var date = new Date();
    var firstDay = new Date(date.getFullYear(), date.getMonth(), 1);
    var lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);
    renderHead($('div#table2'), new Date(firstDay), new Date(lastDay));

This is the function that get the events (blue square) and the difference between startDate and endDate from my database (and the tbody where i manually add the events):

function getEvents(year, month){

    var currentEvents = $('#calendar').fullCalendar('clientEvents').filter(event =\> (new Date(event.start) \> firstDay && new Date(event.end) \<= lastDay));
    
    for(i=0; i\<currentEvents.length; i++) {
        if(currentEvents\[i\].nomeUtente == $("#nomeUtente").data('value')){
            const start = new Date(currentEvents\[i\].start.\_i);
            const end = new Date(currentEvents\[i\].end.\_i);           
            if (currentEvents\[i\].title == "Normali" || currentEvents\[i\].title == "Ferie"){ 
                const milliseconds = Math.abs((end - start)-5400000);
                var hours = milliseconds / 36e5;
            }else{
                const milliseconds = Math.abs(end - start);
                var hours = milliseconds / 36e5;            
            }
            
            if ($("#tblData tbody").length == 0) {
            $("#tblData").append("\<tbody\>"+ "\<tr\>\<td id='norm'\>Normali\</td\>\</tr\>"+
                "\<tr\>\<td id='stra'\>Straordinarie\</td\>\</tr\>"+
                "\<tr\>\<td id='fer'\>Ferie\</td\>\</tr\>"+
                "\<tr\>\<td id='mal'\>Malattia\</td\>\</tr\>"+
                "\<tr\>\<td id='perm'\>Permesso\</td\>\</tr\>"+
                "\<tr\>\<td id='sm'\>Smart Working\</td\>\</tr\>"+
                "\<tr\>\<td id='tras'\>Trasferta\</td\>\</tr\>"+
                "\<tr\>\<td id='anr'\>Assenze non retribuita\</td\>\</tr\>"+
                "\<tr\>\<td id='alt'\>Altro\</td\>\</tr\>"+ "\</tbody\>");
        } 
            
            $("#tblData tbody").append("\<tr\>" +
                //"\<td\>" + currentEvents\[i\].title + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
                "\<td\>" + hours + "\</td\>" +
            "\</tr\>");
        }       
    }
};

For reference, this is my database:

This is what I've been doing so far:

function getEvents(year, month){
var table = document.getElementById('tblData');
var currentEvents = $('#calendar').fullCalendar('clientEvents').filter(event => (new Date(event.start) > firstDay && new Date(event.end) <= lastDay));

for(i=0; i<currentEvents.length; i++) {
    if(currentEvents[i].nomeUtente == $("#nomeUtente").data('value')){
        const start = new Date(currentEvents[i].start._i);
        const end = new Date(currentEvents[i].end._i);          
        if (currentEvents[i].title == "Normali" || currentEvents[i].title == "Ferie"){ //provato a mettere una condizione nel quale se Normali o Ferie togliere millisecondi se no no
            const milliseconds = Math.abs((end - start)-5400000);
            var hours = milliseconds / 36e5;
        }else{
            const milliseconds = Math.abs(end - start);
            var hours = milliseconds / 36e5;            
        }
        
        if ($("#tblData tbody").length == 0) {
            $("#tblData").append("<tbody>"+ "<tr><td id='norm'>Normali</td></tr>"+
                "<tr><td id='stra'>Straordinarie</td></tr>"+
                "<tr><td id='fer'>Ferie</td></tr>"+
                "<tr><td id='mal'>Malattia</td></tr>"+
                "<tr><td id='perm'>Permesso</td></tr>"+
                "<tr><td id='sm'>Smart Working</td></tr>"+
                "<tr><td id='tras'>Trasferta</td></tr>"+
                "<tr><td id='anr'>Assenze non retribuita</td></tr>"+
                "<tr><td id='alt'>Altro</td></tr>"+ "</tbody>");
        } 
        
        
        for (var r = 0, n = table.rows.length; r < n; r++) {
            for (var c = 0, m = table.rows[r].cells.length; c < m; c++) {
                if(table.rows[r].cells[c].innerHTML == currentEvents[i].title){ //controlla contenuto cella se è uguale ad evento
                    $("#tblData tbody #days").append("<tr> <td>" + hours + "</td></tr>");
                }else{
                    alert (table.rows[r].cells[c].innerHTML);
                }
            }
        }                   
    }
}
        

};

But it doesnt work :(