undefinedundefined error on UI

I am getting "undefinedundefined" when i try to preview my app. Not sure what is going on. i followed all the steps.

app.js

var playlist = new Playlist();

var hereComesTheSun = new Song("Here comes the sun", "The Beatles", "2:54"); var walkingOmnsunshine = new Song("Walking On sunshine", "Katrina and the Waves", "3:43");

playlist.add(hereComesTheSun); playlist.add(walkingOmnsunshine);

var playlistElement = document.getElementById("playlist"); console.log(playlistElement); playlist.renderInElement(playlistElement);

var playButton = document.getElementById("play"); playButton.onclick = function () { playlist.play(); playlist.renderInElement(playlistElement);

} var nextButton = document.getElementById("next"); nextButton.onclick = function () { playlist.next(); playlist.renderInElement(playlistElement);

}

var stopButton = document.getElementById("stop"); stopButton.onclick = function () { playlist.stop(); playlist.renderInElement(playlistElement);

}

playlist

function Playlist() {

this.songs = []; this.nowPlayingIndex = 0; }

Playlist.prototype.add = function() { this.songs.push(Song); };

Playlist.prototype.play = function() { var currentSong = this.songs[this.nowPlayingIndex]; };

Playlist.prototype.stop = function(){ var currentSong = this.songs[this.nowPlayingIndex]; currentSong.stop(); };

Playlist.prototype.next = function() { this.stop(); this.nowPlayingIndex++; if (this.nowPlayingIndex === this.songs.length){ this.nowPlayingIndex = 0; }

this.play(); };

Playlist.prototype.renderInElement = function(list) {

list.innerHTML = ""; console.log(list); for (var i = 0; i < this.songs.length; i++) { // console.log(this.songs[i].toHTML); list.innerHTML += this.songs[i].toHTML;

} };

song.js

function Song(title, artist, duration) { this.title = title; this.artist = artist; this.duration = duration; this.isPlaying = false; }

Song.prototype.play = function() {

this.isPlaying = true; };

Song.prototype.stop = function() {

this.isPlaying = false; };

Song.prototype.toHTML = function() { var htmlString = '<li '; if(this.isPlaying){ htmlString += 'class="current"'; } htmlString += '>'; htmlString += this.title; htmlString == ' - '; htmlString += this.artist; htmlString += '<span class="duration">' htmlString == this.duration; htmlString += '</span></li>'; console.log(htmlString); return htmlString; };