Audiojs player. How to make it via div?

Question

I'm new into Javascript (I code in php only) I want to remake this player into DIVs. But I can't understand how to pass DIV blocks to the Audiojs function. Please look at the player. Need an advice.

This is the source http://kolber.github.com/audiojs/demos/test6.html - click here to view the player

    <script>
  jQuery(document).ready(function($) { 
    // Setup the player to autoplay the next track
    var a = audiojs.createAll({
      trackEnded: function() {
        var next = $('#ol #li.playing').next();
        if (!next.length) next = $('#ol #li').first();
        next.addClass('playing').siblings().removeClass('playing');
        audio.load($('a', next).attr('data-src'));
        audio.play();
      }
    });

     var audio = a[0];

    // Load in a track on click
    $('#ol #li').click(function(e) {
      e.preventDefault();
      $(this).addClass('playing').siblings().removeClass('playing');
      audio.load($('a', this).attr('data-src'));
      audio.play();
    });

  });
</script>


    <div id="wrapper">
  <h1>wait what notorious xx <em>(2009)</em></h1>
  <audio preload></audio>

    <div id="ol">
            <span style="float: right;"><a onclick="alert('1')">add</a></span>
            <div id="li"><a data-src="http://s3.amazonaws.com/audiojs/04-islands-is-the-limit.mp3">play</a></div>

            <span style="float: right;"><a onclick="alert('2')">add</a></span>
            <div id="li"><a data-src="http://s3.amazonaws.com/audiojs/03-its-all-about-the-crystalizabeths.mp3">play 2</a></div>

            <span style="float: right;"><a onclick="alert('3')">add</a></span>
            <div id="li"><a data-src="http://s3.amazonaws.com/audiojs/04-islands-is-the-limit.mp3">play 3</a></div>
        </div>

    </div>

The problem is that I want to put more divs inside of But this script takes the next DOM element.

I think that problem with var next = $('#ol #li.playing').next();