Problem with jPlayer plugin

Problem with jPlayer plugin

I am trying to make a simple utility of playing a user-selected MP3 for 'n' times (n being the value chosen by the user). The example given and their music is working fine. But when I turn the URL to my MP3, there is no errors but the music fails to play.

When debugging with Fiddler, I also don't see a request going for this URL. Here is the HTML file for the same.

<html>
  <head>
     <title>Chanting Utilities</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<script language="JavaScript" type="text/javascript" src="./scripts/jquery-1.8.2.min.js"></Script>
<script language="JavaScript" type="text/javascript" src="./scripts/jquery.jplayer.min.js"></Script>
 
<style type="text/css">
#contact-form {
background-color:#F2F7F9;
width:465px;
padding:20px;
margin: 50px auto;
border: 6px solid #8FB5C1;
-moz-border-radius:15px;
-webkit-border-radius:15px;
border-radius:15px;
position:relative;
}

#contact-form h1 {
font-size:42px;
}

#contact-form h2 {
margin-bottom:15px;
font-style:italic;
font-weight:normal;
}

#contact-form input, 
#contact-form select, 
#contact-form textarea, 
#contact-form label {
font-size:15px;
margin-bottom:2px;
}

#contact-form input, 
#contact-form select, 
#contact-form textarea {
width:450px;
border: 1px solid #CEE1E8;
margin-bottom:20px;
padding:4px;
}

#contact-form input:focus, 
#contact-form select:focus, 
#contact-form textarea:focus {
border: 1px solid #AFCDD8;
background-color: #EBF2F4;
}

#contact-form textarea {
height:150px;
resize: none;
}

#contact-form label {
display:block;
}

#contact-form .required {
font-weight:bold;
color:#F00;
}

#contact-form #submit-button {
width: 100px;
background-color:#333;
color:#FFF;
border:none;
display:block;
float:right;
margin-bottom:0px;
margin-right:6px;
background-color:#8FB5C1;
-moz-border-radius:8px;
}

#contact-form #submit-button:hover {
background-color: #A6CFDD;
}

#contact-form #submit-button:active {
position:relative;
top:1px;
}

#contact-form #loading {
width:32px;
height:32px;
background-image:url(../img/loading.gif);
display:block;
position:absolute;
right:130px;
bottom:16px;
display:none;
}


#contact-form ul {
list-style-type:none;
padding:0;
margin:1em 0;
width:100%;
overflow:hidden;
}

#contact-form ul span {
color: #A0A600;
}

#contact-form li {
float:left;
padding-right:1em;
}


</style>  
  </head>
  <body>
     <form>
    <div id="contact-form" class="clearfix">
           <label for="name">Chant: <span class="required">*</span></label>
                <Select Id="drpChant" name="drpChant">
 <Option Value="chants/sv.mp3">Swathi</Option>
 <Option Value="chants/tri.mp3">Triambakam</Option>
</Select>
                
                <label for="email">Chant Count <span class="required">*</span></label>
                <input type="email" id="txtCount" name="txtCount" value="" required />
                
                <span id="loading"></span>
                <input type="button" value="Submit" id="btnSubmit" />
                <p id="req-field-desc"><span class="required">*</span> indicates a required field</p>
<div id="jquery_jplayer"></div>

<div id="divPlayingTrack" style="display:none;">
<fieldset>
  <legend>
     <span id="spnCurrentTrack">No Track Currently</span>
  </legend>
  
  
  <ul>
<li><a id="play" href="#">Play</a></li>
<li><a id="pause" href="#">Pause</a></li>
<li><a id="stop" href="#">Stop</a></li>
</ul>

<ul>
<li>volume :</li>
<li><a id="vmute" href="#">Mute</a></li>
<li> <a id="vhalf" href="#">Half</a></li>
<li><a id="vmax" href="#">Max</a></li>
</ul>
   
<fieldset>
</div>
</div>
<Script Language="JavaScript" type="text/javascript">
  $(document).ready(function() {
       $("#btnSubmit").click (function ()
{   
  $("#divPlayingTrack").css("display","block");
  
      $("#jquery_jplayer").jPlayer({
      errorAlerts: true,
 ready: function () {
  //$("#drpChant").val()
$("#jquery_jplayer").changeAndPlay("chants/sv.mp3");
},
error: function (event)
{
   alert (event.jPlayer.error);
},
swfPath: "./scripts/"
  });

  
  
$("#jquery_jplayer").jPlayerId("play", "play");
$("#jquery_jplayer").jPlayerId("pause", "pause");
$("#jquery_jplayer").jPlayerId("stop", "stop");
$("#jquery_jplayer").jPlayerId("volumeMin", "vmute");
$("#jquery_jplayer").jPlayerId("volumeMax", "vmax");
$("#jquery_jplayer").jPlayerId("volumeBar", "vhalf");

  
   return (false);
});
});
</Script>
   </div>
</form>
  </body>
</html>