Randomly generate which sprite to move via spirtely?

OK, so I'm looking for an interesting effect, here. I have 10 different <div> elements. I would like one of them to be chosen at random every 5 seconds, and then have that <div> that has been selected move to the left (if it's the <div>'s 1-5) first, and then back right to where it started (if it was <div>'s 6-10 it would move right first, and then back left to where it began). I'm looking to accomplish this movement via the jQuery plugin spritely.

Let's start with the rng, which I already have taken care of:

setInterval(function() {
        var rand = Math.floor(Math.random()*9+1);
    if (rand === 1) {
         move <div> #1 left and then right
    }
    else if (rand === 2) {
         move <div> #2 left and then right
    }

Then, rinse and repeat for <div>'s 3-10. This is obviously not by any means an elegant solution, but it gets the job done, as far as I'm concerned.

Now, the next job we must get done is the actual moving itself. Since we have only 5 seconds between the time a <div> is picked and another one is picked, I was thinking of making the movement left and right each last for 2 seconds. Then, there is a second left open for a break.

In order to implement this, I tried the following:

        $("#piranha_smw_gg").oneTime(2000, function() {
            $("#piranha_smw_gg").pan({fps: 30, speed: 2, dir: "left"});
        });
        $("#piranha_smw_gg").oneTime(2000, function() {
            $("#piranha_smw_gg").pan({fps: 30, speed: 2, dir: "right"});
        });

This would be inserted between the if (rand ===1) { } part of the "rng" co开发者_开发知识库de, so to speak.

That code makes use both of spritely, and the jQuery Timers plugin. Now, for some reason, I'm not getting my desired effect with this. Instead of <div>'s 1-5 moving left and then right to where they came from (and the opposite for <div>'s 6-10) I'm getting this odd, spazzing effect.

You can see it here.

Any ideas as to why this is happening?

Thanks!