jQuery Найти следующий элемент привязки и скрыть его?

Question

У меня есть страница с повторяющимися якорями

<div id ="div1">
 <a class='button id='edit1'>Edit</>
<a class='button id='Close'>Close</a>
</div>
<div id ="div2">
 <a class='button id='edit2'>Edit</>
<a class='button id='Close'>Close</a>
</div>
<div id ="div3">
 <a class='button id='edit3'>Edit</>
<a class='button id='Close'>Close</a>
</div>

, когда я нажимаю Изменить якорь, мне нужно найти следующий якорь Close в div и скрыть его.

Вот как япопробовал.

var anchors = $("a[class='button']");
    var position = anchors.index($('a[id=edit' + ID + ']'));
    var next = anchors.get(position + 1);
**next.hide();** // Can i hide like this.

какие-либо предложения?

если вы заметили, что у моего близкого якоря будет общий идентификатор, поэтому я могу быть конкретен с идентификатором

Подробнеесделать это в функции

function abc(id){ 
$('a[id=edit' + id + ']').next('.change').hide();
}

Answer 1

Посмотрите на эту скрипку

HTML:

<div id ="div1">
 <a class='button edit' id='edit1'>Edit</a>
<a class='button close' id='close1'>Close</a>
</div>
<div id ="div2">
 <a class='button edit' id='edit2'>Edit</a>
<a class='button close' id='close2'>Close</a>
</div>
<div id ="div3">
 <a class='button edit' id='edit3'>Edit</a>
<a class='button close' id='close3'>Close</a>
</div>

JS:

$('.edit').click(function() {
    $(this).next('.close').hide();
});

Answer 2

<div id ="div1">
 <a class='button edit' id='edit1'>Edit</a>
<a class='button Close'>Close</a>
</div>

добавить edit класс

$("a.edit").click(function(){
$("a.Close").show(); //show the previously hidden element
$(this).next("a").hide(); //hide the intended one
});

DEMO

Answer 3

Используйте функцию next () в jquery

$(".edit").click(function(){
     $(this).next(".close").hide();
});

И, кстати, вы не можете иметь один и тот же идентификатор для нескольких элементов.Вместо этого используйте класс.