Jquery函數級聯。添加/刪除類到下一個只有

Question

任何感覺友善的人足以幫助我連接此功能？ ul結構必須保持原樣。

<ul> 
<li><a href="#"><img src="http://www.fillmurray.com/80/80"></a></li> 
<li class="hidehot"><img src="http://i.imgur.com/K1SkRxC.png" id="hot"></li> 
<li><a href="#"><img src="http://www.fillmurray.com/80/80"></a></li> 
<li class="hidehot"><img src="http://i.imgur.com/K1SkRxC.png" id="hot"></li> 
</ul> 

li { 
    list-style: none; 
} 
img#hot { 
    width: 25px; 
    position: absolute; 
    margin-top: -50px; 
} 

.hidehot { 
display: none; 
} 


$(document).ready(function(){ 
    $("li").removeClass("hidehot"); 
}); 
/* 
    $('img').click(function() { 
    $('li').next??.addClass('hidehot'); 

    ?? 
*/  

jquery在加載時刪除偶數編號的li（.hot）上的hide類，因此全部都可見。

奇li/a/img需要充當觸發器來爲下一個偶數編號li添加'hide'類。

然後，我需要幾個觸發器中的任何一個再次移除該類，使其可見。

希望是有道理的。 任何幫助非常感謝！

這裏有一個小提琴 https://jsfiddle.net/ChilledMonkeyBrain/sLv8gvy9/7/

Answer 1

你只需要的一點點幫助你的jQuery選擇。

$("li").removeClass("hidehot"); 
$('img').click(function() { 
    $(this).closest('li').next().addClass('hidehot'); 
}); 

https://jsfiddle.net/sLv8gvy9/9/

你理解它是如何工作的？