別のリストにjQueryポップアップを表示するには

Question

私はそれを助ける必要があります。私が.btm-arrowクラスをクリックすると、そのポップアップボックスの表示だけにします。しかし今、すべてのポップアップボックスが表示されます。 私はクラスattrで使用されているので、その矛盾です。

HTMLコード

<div class="TableData"> 
<ul> 
<li>SURAT AL-FATIHAH</li> 
<li>SURAT AL-FATIHAH</li> 
</ul> 
<p><input type="text" name="#" placeholder="Type Your Item"></p> 
</div> 
<a href="#"> 
<i class="fa fa-arrow-circle-o-down btm-arrow" aria-hidden="true"></i> 
</a> 

のjQueryコード

<script src="js/jquery.js"></script> 
<script> 
$(function(){ 
$('.btm-arrow').click(function(){ 
$('.TableData').toggle();; 
}); 
}); 
</script> 

Answer 1

あなたは最も近い（）とPREV（）jqueryのの方法を使用して、この解決策を見つけることができます。

$('.btm-arrow').click(function(){ 

    $(this).closest("a").prev().toggle();; 
}); 

実施例あなたはここで見つけることができます - https://jsfiddle.net/20rx1nvp/2/