title: HTML5 Audio callback fails on safari/iOS
body: <p>I have built an app, designed to play each sound as the first one is finished by using 'ended' event.</p>
  
  <p>In my initial version, each sound has its own audio element, resulting in something like:</p>
  
  <pre><code>   function play_next_audio(){
          speaker = $('audio#' + sounds[i++]).get(0);
          speaker.addEventListener('ended',play_next_audio);
          speaker.play();
     }
  </code></pre>
  
  <p>This works great on all desktop browsers, including Safari, but does not go beyond the very first letter on iOS.</p>
  
  <p>I have also tried a different approach - a single audio element that loads each sound in turn.  There I experimented with binding the 'ended' event as well as loading first and binding 'canplaythrough' event instead.  In both cases, it fails to work even on the desktop Safari - this time successfully playing the first <em>two</em> letters.</p>
  
  <p>Here is the isolated test:</p>
  
  <p><a href="http://dev.connectfu.com:42001/app/test-sounds.html" rel="noreferrer">http://dev.connectfu.com:42001/app/test-sounds.html</a>  </p>
  
  <p>Note that audio.load() is commented out several places - having it in or out seems to make no difference.</p>
  
  <p>What am I doing wrong?  How can I play series of sounds on iOS?  Thank you so much for the help!</p>