Как добавить закрытие функции jQuery .each?

Question

У меня есть несколько ссылок с двумя классами, как это:

<a href="#" class="button post-12">Babylon</a> 
<a href="#" class="button post-47">Sumer</a> 
<a href="#" class="button post-87">Ur</a> 

Я wan't каждый из этих кнопок, чтобы скрыть коррелирующий пост, например, нажав на ссылку с классом «пост-12 «скрыть это:

<p id="post-12">Babylon was an aicient city...</p> 

Чтобы это произошло, у меня есть этот сценарий jQuery. Но это всегда сообщение с id «post-87», которое закрывается всеми тремя кнопками.

var secondClass; 
$('.button').each(function(){ 
    secondClass = $(this).attr('class'); 
    secondClass = secondClass.replace('button ',''); 
    $(this).click(function(){ 
     $('#'+secondClass+'').hide(); 
    }); 
}); 

Что я здесь делаю неправильно? Как добавить закрытие функции jQuery .each?

Answer 1

Изменить масштаб вашей декларации secondClass:

$('.button').each(function(){ 
    var secondClass = $(this).attr('class'); 
    secondClass = secondClass.replace('button ',''); 
    $(this).click(function(){ 
     $('#'+secondClass+'').hide(); 
    }); 
}); 

Answer 2

Я думаю, что мы можем воспользоваться -data в вашем сценарии:

<a href="#" data-divid="post-12" class="button post-12">Babylon</a> 
<a href="#" data-divid="post-47" class="button post-47">Sumer</a> 
<a href="#" data-divid="post-87" class="button post-87">Ur</a> 

$('.button').click(function(){ 
    var divtoclose = $(this).data("divid"); 
    $('#'+divtoclose).hide(); 
});