I have an xml list of mp3 files in jquery mobile that directs the user to an HTML5 audio player by passing the mp3 path via url, which is then inserted into the src of an audio tag. However, the src will only change when I hit refresh and not when it loads for the first time. What am I missing? Here is the code:
$( document ).bind( 'pageinit',function(event){
var url = $.url();
var mp3 = url.attr('query');
var play = document.querySelector("audio");
play.src=mp3;
play.load();
});
and
<div data-role="page" id="audiopage" data-ajax="false">
<div id="audio">
<audio controls="control" preload="none" src="" type="audio/mp3" id="sound"></audio>