I am experiencing an issue with a section of my code where I am fetching values from the server and updating a table if a certain value is not present. Once the update is made, I want to visually notify the user by temporarily making the cell's value bold for a specific duration.
var table=document.getElementById("employee_details");
var jsonString = JSON.stringify(array);
$.ajax({
url: '/server.php',
type: 'POST',
data: {"input":"calculate_charges",
data:jsonString},
cache: false,
success:function(response){
const arr3=JSON.parse(response);
for(var i=0; i<arr3.length; i++){
if(table.rows[i+1].cells.item(10).innerHTML!=arr3[i][2]){
table.rows[i+1].scrollIntoView({
behavior: 'smooth',
block: 'center'
});
table.rows[i+1].cells.item(10).innerHTML=arr3[i][2];
setTimeout(function(){
table.rows[i+1].cells.item(10).style.fontWeight = "500";
},7000);
setTimeout(function(){
table.rows[i+1].cells.item(10).style.fontWeight = "900";
},4000);
}
}
}
complete:function(){}
});
Upon execution, I encounter an error in the console:
Uncaught TypeError: Cannot read properties of undefined (reading 'cells')
As a result, the cell does not appear bold as desired. How can I resolve this issue?