title: how to make a jQuery click function play a song in jPlayer?
body: <p>is it possible to create a jQuery click function that will play the first song in a jPlayer playlist?</p>
  <p>i've been referring to the documentation here:</p>
  <p><a href="http://www.jplayer.org/latest/demo-02-jPlayerPlaylist/" rel="nofollow noreferrer">http://www.jplayer.org/latest/demo-02-jPlayerPlaylist/</a></p>
  <p>and there is an example of a link that displays 'play' which when clicked plays the first track in a playlist, but i'm not sure how this is being triggered.</p>
  <p>the documentation later references:</p>
  <blockquote>
  <p><strong>play([index:Number]) : Void</strong></p>
  <p>Plays the item in the playlist. Plays the current item if no param is given. A positive index plays items from the start of the playlist while a negative index plays items from the end.</p>
  </blockquote>
  <pre><code>// Examples of usage:
  myPlaylist.play(); // Plays the currently selected item
  myPlaylist.play(0); // Plays the 1st item
  myPlaylist.play(1); // Plays the 2nd item
  myPlaylist.play(-1); // Plays the last item
  </code></pre>
  <p>so my question is, can this functionality be triggered through a click function in jQuery and if so could anyone advise on the basic syntax that would be required?</p>
  <p>thank you.</p>
  <p>update:</p>
  <p>to provide more context and an example of what i am attempting, in the head area there are existing click functions and i'm trying to add the instruction to play the track here as well, for example:</p>
  <pre><code>&lt;script&gt;
  $(document).ready(function(){
  $(&quot;.open_doors&quot;).click(function(){
  $(&quot;#leftdoor_inner&quot;).animate({&quot;left&quot;: &quot;-=164px&quot;}, 'slow');
  // etc ....
  // here is attempt to trigger jPlayer
  myPlaylist.play(0); 
  });
  &lt;/script&gt;
  </code></pre>
  <p>and this is the playlist defined in the head area:</p>
  <pre><code>&lt;script type=&quot;text/javascript&quot;&gt;
  //&lt;![CDATA[
  $(document).ready(function(){
  var myPlaylist = new jPlayerPlaylist({
  jPlayer: &quot;#jquery_jplayer_1&quot;,
  cssSelectorAncestor: &quot;#jp_container_1&quot;,
  verticalVolume: &quot;true&quot;,
  }, [
  {
  title:&quot;Cro Magnon Man&quot;,
  mp3:&quot;http://www.jplayer.org/audio/mp3/TSP-01-Cro_magnon_man.mp3&quot;,
  oga:&quot;http://www.jplayer.org/audio/ogg/TSP-01-Cro_magnon_man.ogg&quot;
  },
  {
  title:&quot;Your Face&quot;,
  mp3:&quot;http://www.jplayer.org/audio/mp3/TSP-05-Your_face.mp3&quot;,
  oga:&quot;http://www.jplayer.org/audio/ogg/TSP-05-Your_face.ogg&quot;
  }
  ], {
  swfPath: &quot;js&quot;,
  supplied: &quot;oga, mp3&quot;,
  wmode: &quot;window&quot;
  });
  });
  //]]&gt;
  &lt;/script&gt;
  </code></pre>
  <p>so this set up is currently not working and i am not sure if i am referencing the playlist properly in the jQuery click function.</p>
  <p>thank you.</p>
  <p><strong>update, solution:</strong></p>
  <p>ok i figured out a solution, i had to add the code within the script area that defines the playlist (see above) in the following fashion:</p>
  <pre><code>{
  swfPath: &quot;js&quot;,
  supplied: &quot;oga, mp3&quot;,
  wmode: &quot;window&quot;
  });
  $(&quot;.open_doors&quot;).click(function() {
  myPlaylist.play(0);
  });
  </code></pre>