Why do I keep getting undefined in my loop? I cant figure out how to get rid or why its showing up.

var students = [
  {
    name: 'Joe',
    track: 'Full Stack JavaScript',
    achivements: 10,
    points: 1000
  },
  {
    name: 'Sally',
    track: 'IOS',
    achivements: 25,
    points: 1500
  },
  {
    name: 'Zack',
    track: 'Ruby',
    achivements: 5,
    points: 500
  },
  {
    name: 'Mark',
    track: 'C++',
    achivements: 20,
    points: 800
  },
  {
    name: 'Sammy',
    track: 'Java',
    achivements: 15,
    points: 700
  }
];

var html;
var student;

function print(message) {
  var outputDiv = document.getElementById('output');
  outputDiv.innerHTML = message;
}

for(let i = 0; i < students.length; i++) {
  student = students[i];
  html += `<h2>Student: ${student.name}</h2>`;
}