Hey, I'm having some trouble altering the values on my HTML page using JavaScript and CSS. Unfortunately, it's not working as expected. Can someone please take a look at my code and help me out?
// Displaying persons and their records
for (const person of Object.values(data.recordedData)) {
let val = 1;
let tr = document.createElement('tr');
let thp = document.createElement('th');
thp.innerHTML = person.student;
tr.appendChild(thp);
// Adding person to dropdown
let option = document.createElement("option");
option.innerText = person.student;
option.value = person.profile;
option.parameter = person;
list.appendChild(option);
for (const value of Object.values(person.values)) {
let tdp = document.createElement('td');
tdp.innerText = value;
// Applying color changes here
if (value < 5) {
tdp.className = 'Red';
} else {
tdp.className = 'Green';
}
tr.appendChild(tdp);
}
table.appendChild(tr);
val++
}