JQuery цикл через таблицу

Question

У меня есть таблица:

<table class="table table-striped"> 
    <thead> 
     <tr> 
      <th>Music</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td><a href="http://www.domin.com/link1.mp3">link1</a></td> 
     </tr> 
     <tr> 
      <td><a href="http://www.domin.com/link2.mp3">link2</a></td> 
     </tr> 
     <tr> 
      <td><a href="http://www.domin.com/link3.mp3">link3</a></td> 
     </tr> 
    </tbody> 
</table> 

У меня также есть две кнопки, next и prev:

<button id="prev">Previous</button> 
<button id="next">Next</button> 

Я хочу, чтобы каждый раз, нажмите на следующей или предыдущая кнопки установить класс play для активную строку и получить play mp3-адрес и установить в jplayer с помощью этой функции:

$('.play')(function() { 
    var url = $(this).attr('href'); 
    $("#jquery_jplayer_1").jPlayer("setMedia", { 
     mp3: url 
    }).jPlayer("play"); 
    return false; 
}); 

Answer 1

Я добавил класс play к одному из a в таблице. Next начинается с первой строки. Prev начинается с последней строки. Затем переместите строчные строки и петлю, если они попадут в верхнюю/нижнюю часть.

JSFiddle Demo

$('#next').click(function() { 
    if ($('table td a.play').length > 0 && $('table td a.play').parents('tr').next().length > 0) { 
     $('table td a.play').removeClass('play').parents('tr').next().find('a').addClass('play'); 
    } else { 
     $('table td a.play').removeClass('play'); 
     $('table td').first().find('a').addClass('play'); 
    } 
}); 

$('#prev').click(function() { 
    if ($('table td a.play').length > 0 && $('table td a.play').parents('tr').prev().length > 0) { 
     $('table td a.play').removeClass('play').parents('tr').prev().find('a').addClass('play'); 
    } else { 
     $('table td a.play').removeClass('play'); 
     $('table td').last().find('a').addClass('play'); 
    } 
});