Controlling JW FLV player with jQuery

Question

I'm trying to control an instance of the JW FLV player player using jquery.

What I want to do is have a series of links which when clicked load an XML playlist into the player.

By following the tutorial here I've gotten things working basically as I want them in terms of functionality, but even I can see that it's ugly as sin, as at the moment my anchors look like this:

<a class="media" href="#"
onclick="player.sendEvent('STOP');
player.sendEvent('LOAD',
'path/to/playlist.xml');
return false;">load playlist</a>

while this gets a ref to the player

var player = null;
function playerReady(obj)
{
  player = gid(obj.id);
};

function gid(name)
{
  return document.getElementById(name);
};

What I'd like to be able to do is have my anchors look like this:

<a class="media" href="#" rel="path/to/playlist.xml">load playlist</a>

And then use jquery to find the anchors with class="media", read the value of the element's rel attribute and then bind a click event to it which triggers an appropriate function. Alas this is beyond my extremely meagre powers.

So far I've got:

$('a.media').click(function()
  {
    playlist = $(this).attr("rel");
    player.sendEvent('LOAD', playlist
  }
);

Which clearly doesn't work. Anyone care to help an idiot/n00b?

I should say that really what I want to do is learn rather than just get some one else to do it, so if you can explain things a bit that would be extra awesome.

Solution

What you're doing seems correct to me, although I'm not sure variable "player" is defined there; it depends on the context.

What you can do is something like

$('a.media').click(function () {
  var player = $("#player-id");
  if(player.length == 1){
    player = player[0];
    var playlist = $(this).attr("rel");
    player.sendEvent('LOAD', playlist);
  }
});