Player Audio avec Playlist

Bonjour,

Voila je suis en train de créer un petit lecteur audio, mais j'ai un petit soucis, étant tout jeune dans le javascript j'ai quelque difficulté.
HTML

<audio id="audio" src="../../MCKEY TRAXX - Come With Me.mp3" ontimeupdate="update(this)"></audio>     
     		<div>
     			<input type="text" id="display" disabled/> 
     		</div>
     
            <div>
            	<span id="progressTime">00:00</span>                
            	<div id="progressBarControl">
                    <div id="progressBar" onclick="clickProgress('audio', this, event)">Pas de lecture</div>
                </div>
                <span id="progressFullTime">00:00</span>                           
            </div>
     
            <button id="PlayPause" class="control" onclick="play('audio', this)">Play</button>
            <button class="control" onclick="stop('audio')">Stop</button></br></br><button class="control" onclick="next('audio')">Next</button>             
            <span class="volume">
                <a class="stick1" onclick="volume('audio', 0)"></a>
                <a class="stick2" onclick="volume('audio', 0.3)"></a>
                <a class="stick3" onclick="volume('audio', 0.5)"></a>
                <a class="stick4" onclick="volume('audio', 0.7)"></a>
                <a class="stick5" onclick="volume('audio', 1)"></a>
            </span>
           
            <div>
            <!--la playlist-->        
		        <ol id="playlist">
					<li onclick="clickPlaylist(this,'../../MCKEY TRAXX - Come With Me.mp3','Mickey Traxx','Come With Me')" class="song">Mickey Traxx - Come With Me</li>
					<li onclick="clickPlaylist(this,'../../Jousboxx-BuzzerBeater.ogg','Jousboxx','BuzzerBeater')" class="song">Jousboxx - BuzzerBeater</li>
				</ol>
         	</div>

JS

function play(idPlayer, control) {
                    var player = document.getElementById('audio');
					var button = document.getElementById('PlayPause'); 
					   
                    if (player.paused) {
                        player.play();
                        control.textContent = 'Pause';
                    } else {
                        player.pause();
                        control.textContent = 'Play';
                    }
                }
 
                function stop(idPlayer, control) {
                    var player = document.getElementById('audio');
					     
                    player.pause();                  
                    player.currentTime = 0;                    
                    document.getElementById('PlayPause').textContent = 'Play';   				                                                           
                }
				                
                
                
       
                function volume(idPlayer, vol) {
                    var player = document.getElementById('audio');
 
                    player.volume = vol;   
                }
       
                function update(player) {
                    var duration = player.duration;    // Durée totale
                    var time     = player.currentTime; // Temps écoulé
                    var fraction = time / duration;
                    var percent  = Math.ceil(fraction * 100);
 
                    var progress = document.getElementById('progressBar');
     
                    progress.style.width = percent + '%';
                    progress.textContent = percent + '%';
           
                    document.getElementById('progressTime').textContent = formatTime(time);
                    document.getElementById('progressFullTime').textContent = formatTime(duration);                    
                }
                       
                function formatTime(time) {
                    var hours = Math.floor(time / 3600);
                    var mins  = Math.floor((time % 3600) / 60);
                    var secs  = Math.floor(time % 60);
     
                    if (secs < 10) {
                        secs = "0" + secs;
                    }
     
                    if (hours) {
                        if (mins < 10) {
                            mins = "00" + mins;
                        }
         
                        return zeroPad(hours, 2) + ":" + zeroPad(mins, 2) + ":" + zeroPad(secs, 2); // hh:mm:ss
                    } else {
                        return zeroPad(mins, 2) + ":" + zeroPad(secs, 2); // mm:ss
                    }
                }
                
                // fonction pour afficher joliment les nombres
				function zeroPad(num, places) {
				    var zero = places - num.toString().length + 1;
				    return Array(+(zero > 0 && zero)).join("0") + num;
				}                
       
                function clickProgress(idPlayer, control, event) {
                	var player = document.getElementById('audio');                	
                    var parent = getPosition(control);    // La position absolue de la progressBar
                    var target = getMousePosition(event); // L'endroit du la progressBar où on a cliqué
                    
                    var x = target.x - parent.x;
                    var y = target.y - parent.y;
     
                    var wrapperWidth = document.getElementById('progressBarControl').offsetWidth;
     
                    var percent  = Math.ceil((x / wrapperWidth) * 100);
                    var duration = player.duration;
     
                    player.currentTime = (percent * duration) / 100;
                }               
                
 
                function getMousePosition(event) {
                    if (event.pageX) {
                        return {
                            x: event.pageX,
                            y: event.pageY
                        };
                    } else {
                        return {
                            x: event.offsetX + document.body.scrollLeft + document.documentElement.scrollLeft,
                            y: event.offsetY + document.body.scrollTop  + document.documentElement.scrollTop
                        };
                    }
                }
 
                function getPosition(element){
                    var top = 0, left = 0;
     
                    while (element) {
                        left   += element.offsetLeft;
                        top    += element.offsetTop;
                        element = element.offsetParent;
                    }
     
                    return { x: left, y: top };
                }             
                //click playlist
				function clickPlaylist(sender,senderID,artist,title){
					var player = document.getElementById('audio');
					player.pause();
					player.load();
					player.src = senderID;
					player.play();
					var display = document.getElementById('display');	
					display.setAttribute('value',artist+' - '+title);	
					
					<b>player = new player("start url");

				  	player.addEventListener('ended',function(){
				    player.pause();
					player.load();
					player.src = "new url";
					player.play();
				    });	</b>				
						
					var supp = document.getElementsByClassName('selected');
					if(supp[0])
					{
						supp[0].removeAttribute('class');
					}
					sender.setAttribute('class','selected');
				} 

Mes questions sont les suivantes :
Comment faire pour que ma playlist joue en continue (En gras ce que j'ai essayé)?
Comment faire pour que mon bouton NEXT passe à la musique suivantes (Code ci-dessous)?

var currentIdSong = 0; // numéro de la musique en cours (commence à 0)
var songs = document.querySelectorAll('onclick'); // liste des musiques (balises a)
var songsLength = songs.length; // nombre de musiques
var currentSong = player.src; // nom du fichier de la musique en cours				
function next(idPlayer) {
		var player = document.getElementById('audio');					
		currentIdSong = (currentIdSong + 1) % songsLength;
		currentSong = songs[currentIdSong].getAttribute('song');
} 

Besoin de votre aide et quelques explications aussi.