title: Is there a way to create a shuffle mode with html5 audio player
body: <p>I am trying to create a shuffle mode for multiple playlists with the native html5 audio player.  I am not that great with javascript i am more of a web designer and not developer. I cannot find anything on creating a shuffle mode online so I figured I would ask the question here and see if someone can help.  I have multiple playlists and would like to create a shuffle mode for each individual playlist and load it into the one audio player.  Is this possible with javascript or jquery?  Here is my code that I have for my audio playlists.</p>
  
  <pre><code> &lt;audio id="player" controls="controls"&gt;
      &lt;source src="#" type="audio/ogg"&gt;
      &lt;source src="#" type="audio/mp3"&gt;
   &lt;/audio&gt;
  
   &lt;ul class="playlist"&gt;
       &lt;li&gt;&lt;button class="music-button" onclick='track1()'&gt;Track1&lt;/button &lt;/li&gt;
       &lt;li&gt;&lt;button class="music-button" onclick='track2()'&gt;Track2&lt;/button &lt;/li&gt;
       &lt;li&gt;&lt;button class="music-button" onclick='track3()'&gt;Track3&lt;/button &lt;/li&gt;
   &lt;/ul&gt;
  
   &lt;ul class="playlist2"&gt;
       &lt;li&gt;&lt;button class="music-button" onclick='track1()'&gt;Track1&lt;/button &lt;/li&gt;
       &lt;li&gt;&lt;button class="music-button" onclick='track2()'&gt;Track2&lt;/button &lt;/li&gt;
       &lt;li&gt;&lt;button class="music-button" onclick='track3()'&gt;Track3&lt;/button &lt;/li&gt;
   &lt;/ul&gt;
  
   &lt;script&gt;
        function track1(){
  
        var player=document.getElementById('player');
        var sourceOgg=document.getElementById('player');
        var sourceMp3=document.getElementById('player');
  
        sourceOgg.src='url.ogg';
        sourceMp3.src='url.mp3';
  
         player.load();
         player.play(); 
   }
  
        function track2(){
  
        var player=document.getElementById('player');
        var sourceOgg=document.getElementById('player');
        var sourceMp3=document.getElementById('player');
  
        sourceOgg.src='url.ogg';
        sourceMp3.src='url.mp3';
  
         player.load();
         player.play(); 
   }
  
        function track3(){
  
        var player=document.getElementById('player');
        var sourceOgg=document.getElementById('player');
        var sourceMp3=document.getElementById('player');
  
        sourceOgg.src='url.ogg';
        sourceMp3.src='url.mp3';
  
         player.load();
         player.play(); 
   }
  
   &lt;/script&gt;
  </code></pre>