PHP and Javascript to play audio

I have the following script that will open up a specific directory and list all of the folders and all of the files in the folders.  They are all music files.  It works great but won't play the music file.  I think it is because I'm not defining the src="" correctly.

<fieldset>
  <script>
	$(document).ready(function(){
		$("#play-bt").click(function(){
			$("#audio-player")[0].play();
			$("#message").text("Music started");
		})
 
		$("#pause-bt").click(function(){
			$("#audio-player")[0].pause();
			$("#message").text("Music paused");
		})
 
		$("#stop-bt").click(function(){
			$("#audio-player")[0].pause();
			$("#audio-player")[0].currentTime = 0;
			$("#message").text("Music Stopped");
		})
	})
</script>
<?

// Set directory path
$dir = "D:music/";
  
  function ListFolder($path)
{
    //using the opendir function
    $dir_handle = @opendir($path) or die("Unable to open $path");
   
    //Leave only the lastest folder name
    $dirname = end(explode("/", $path));
   
    //display the target folder.
    echo ("<li>$dirname\n");
    echo "<ul>\n";
    while (false !== ($file = readdir($dir_handle)))
    {
        if($file!="." && $file!="..")
        {
            if (is_dir($path."/".$file))
            {
                //Display a list of sub folders.
                ListFolder($path."/".$file);
            }
            else
            {
                //Display a list of files.
                echo "<li><audio id=\"audio-player\" name=\"audio-player\" src=\"$dir $file\" ></audio>
<div id=\"message\"></div>
<a id=\"play-bt\" href=\"#\">Play music</a> | <a id=\"pause-bt\" href=\"#\">Pause music</a> | <a id=\"stop-b\t\" href=\"#\">Stop music</a></li>";
            }
        }
    }
    echo "</ul>\n";
    echo "</li>\n";
   
    //closing the directory
    closedir($dir_handle);
}
  

 ?> 
  <ul class="dmxtree" id="FolderView">
 
<?php ListFolder($dir); ?>
</ul>

 
</fieldset>

Select allOpen in new window