Jqueryのみ表示/非表示を1つのインスタンスに限定します

Question

ユーザーがターゲットをクリックすると新しいメニューを表示し、このインターフェイスに複数のインスタンスがあり、それぞれのターゲットが同じメニューを表示するインターフェイスを構築しています私はクリックされたそのターゲットの下にあるメニューを表示したいだけです。その時点で、すべてのメニューをクリックするターゲットが表示されます。

$('.statuses').hide(); 
$('.employer .status').click(function(e){ 
    alert('clicked'); 
    $('.employer .status').next('.statuses').show(); 
}); 

そして、私のHTML

<div id="left-column"> 
<?php foreach($jobs as $j): ?> 
<p><strong><?php echo $j['jobtitle']; ?></strong> &pound;<?php echo $j['salary']; ?>, <?php echo $j['job_summary']?> </p> 
    <ul> 
    <?php foreach($applications as $a): ?> 
     <?php if ($j['jobtitle'] == $a['jobtitle']): ?> 
      <li> 
       <img src="/media/uploads/candidates/<?php echo preg_replace('/(.gif|.jpg|.png)/', '_thumb$1', $a['profile_image']);?>" width="90" height="60" alt="Hello"/> 
       <p><?php echo $a['name']; ?></p> 
       <p class="<?php echo $a['status'];?> status"><?php echo ucfirst($a['status']);?></p> 
       <div class="statuses"> 
        <p class="status pending"><a href="/employer/status/aid/<?php $a['id'];?>/pending">Pending</a></p> 
        <p class="status unsuccessful"><a href="/employer/status/aid/<?php $a['id'];?>/unsuccessful">Unsuccessful</a></p> 
        <p class="status successful"><a href="/employer/status/aid/<?php $a['id'];?>/successful">Successful</a></p> 
       </div> 
       <p class="date"><?php echo date("d.m.Y", $a['created_at']);?></p> 
      </li> 
     <?php endif; ?> 
    <?php endforeach; ?> 
</ul> 
<?php endforeach; ?> 

Answer 1

$('.statuses').hide(); 
$('.employer .status').click(function(e){ 
    $(this).next('.statuses').show(); 
});