I understand how the loop works here but I'm slightly confused as to how I am able to keep re-writing the data variable and it still returns the entire <tr> body?

I would have expected the last statement </tr> to be the final value of data but somehow it's including everything and returning a complete HTML block.

Noob question, but I can't figure it out. I've never worked with HTML like this.

let data = "";

if (this.tasks.length > 0) {
  for (let i = 0; i < this.tasks.length; i++) {
    data += '<tr>'
    data += '<td>'+(i+1)+". " + this.tasks[i] + '</td>';
    data += '<td><button onclick="app.Edit(' + i + ')"  class="btn btn-warning">Edit</button></td>';
    data += '<td><button onclick="app.Delete(' + i + ')"  class="btn btn-danger">Delete</button></td>';
    data += '</tr>';
  }
}