背景イメージを変更するにはどうすればよいですか？

Question

これはとても簡単に聞こえますが、私はそれをすることができないようです。アイデアは、 'a'タグがクリックされたときに、 'collapsed'というクラスがあるかどうかをチェックすることです。そうであれば、 'ul'バックグラウンドを変更します（タグはその一部です）。私は「a」タグがクリックされたかどうかわからないので、それがその一部である 'ul'のIDを知らないのです...私は親 'ul'を見つけるためにドリルアップできると思っていましたが、働いていない。

HTML：

<ul class="some-class" id="some-id-1"> 
    <a href="#" id="id-1">something</a> 
    <li> 
     <a class="collapsed">something else</a> 
    </li> 
</ul> 

<ul class="some-class" id="some-id-2"> 
    <a href="#" id="id-2">something</a> 
    <li> 
     <a class="collapsed">something else</a> 
    </li> 
</ul> 

<ul class="some-class" id="some-id-3"> 
    <a href="#" id="id-3">something</a> 
    <li> 
     <a class="collapsed">something else</a> 
    </li> 
</ul> 

私のスクリプト：

$('a').click(function() { 
    var cName = this.className; 
    switch(cName) { 
     case 'collapsed' : 
     $(this).parent().find('> ul').css('background','url(img/red.png) 0 0'); 
     break; 
    }; 
}); 

私が間違って何をしているのですか？任意およびすべての提案は歓迎されている...

Answer 1

はjQueryのclosest機能をこのように使用してみてください -

$('a').click(function() { 
    var cName = $(this).attr('class'); 
    if(cName == 'collapsed') { 
     $(this).closest('ul').css('background','url(img/red.png) 0 0'); 
    }; 
}); 

Answer 2

まず最初に、thisは$(this)のように使用する必要があります。

$('a').click(function() { 
    // Change the first .collapsed element next to the clicked a 
    $(this).next('.collapsed').css('background-color', 'url(img/red.png) 0 0'); 
});