Всем привет, мне нужно вывести данные объекта на страницу html и добавить возможность удалять студентов. Но у меня почему-то ничего не выводится на страницу, помогите разобраться в чем ошибка, буду благодарен
<table class="students">
<thead>
<tr>
<th>Name</th>
<th>Estimate</th>
<th>Course</th>
<th>Active</th>
<th>Action</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
function Student(){
this.students = [
{ name: "Ivan", estimate: 4, course: 1, active: true },
{ name: "Petr", estimate: 3, course: 1, active: false },
{ name: "Alex", estimate: 2, course: 4, active: false },
{ name: "Max", estimate: 5, course: 2, active: true },
{ name: "Anton", estimate: 2, course: 3, active: true },
{ name: "Roman", estimate: 3, course: 2, active: false },
{ name: "Vladimir", estimate: 2, course: 4, active: true },
{ name: "Oleg", estimate: 5, course: 3, active: true },
{ name: "Evgeniy", estimate: 5, course: 5, active: true },
{ name: "Pavel", estimate: 3, course: 5, active: true },
{ name: "Danil", estimate: 2, course: 3, active: true },
{ name: "Denis", estimate: 4, course: 4, active: false },
];
}
Student.prototype.render = function(){
let tbody = document.querySelector(".students tbody");
tbody.innerHTML = "";
let self = this;
for (i = 0; i < this.students.length; i++){
let tr = document.createElement("TR");
let td = document.createElement("TD");
td.innerHTML = this.students[i].name;
tr.appendChild(td);
td = document.createElement("TD");
td.innerHTML = this.students[i].estimate;
tr.appendChild(td);
td = document.createElement("TD");
td.innerHTML = this.students[i].course;
tr.appendChild(td);
td = document.createElement("TD");
td.innerHTML = this.students[i].active;
tr.appendChild(td);
td = document.createElement("TD");
td.innerHTML = "Удалить";
td.addEventListener("click", (function(index) {
return function(event){
self.remove(index);
self.render();
};
})(i));
tr.appendChild(td);
tbody.appendChild(tr)
}
};
Student.prototype.remove = function(index){
let self = this;
this.students.splice(index, 1);
self.render();
};
