How do I add a class to an element's parent using jQuery? -


i have music page set , when play button clicked song, class changes buttons_mp3j buttons_mp3jpause. when class buttons_mp3jpause, want target parent li.song , add class it.

<li class="song">     <div>         <span>             <span class="buttons_mp3jpause">             </span>         </span>     </div> </li> 

i have tried following code didn't work.

$(".buttons_mp3jpause").parents("li.song").addclass("playing"); 

where did go wrong?

edit

$('.haiku-play').bind('click', function() {     $('.haiku-player').jplayer("pause"); }) 

edit 2

<article>     <ul>         <li class="song">yadayada</li>         <li class="song">yadayada</li>         <li class="song">yadayada</li>         <li class="song">yadayada</li>     </ul> </article> <article>     <ul>         <li class="song">yadayada</li>         <li class="song">yadayada</li>         <li class="song">yadayada</li>         <li class="song">yadayada</li>     </ul> </article> <article>     <ul>         <li class="song">yadayada</li>         <li class="song">yadayada</li>         <li class="song">yadayada</li>         <li class="song">yadayada</li>     </ul> </article> 

as mentioned in question, you're assigning class buttons_mp3jpause dynamically, need attach handler element exists in dom on page load, , delegate dynamic class, using jquery's .on():

$('.song').on('click', '.buttons_mp3jpause', function() {     $(this).closest('li.song').addclass('playing'); }); 

in response first comment:

simply remove playing class other song elements (the below presumes of song elements siblings!):

.addclass('playing').siblings('li.song').removeclass('playing');

in response last comment:

the easiest thing in situation remove playing class song elements, , add relevant one:

$('li.song').removeclass('playing'); $(this).closest('li.song').addclass('playing'); 

complete example:

$('.song').on('click', '.buttons_mp3jpause', function() {     $('li.song').removeclass('playing');     $(this).closest('li.song').addclass('playing'); }); 

Comments

Popular posts from this blog

monitor web browser programmatically in Android? -

Shrink a YouTube video to responsive width -

wpf - PdfWriter.GetInstance throws System.NullReferenceException -