Задача обхода jQuery

Question

Я столкнулся с проблемой, которая кажется не совсем правильной. У меня есть пара якорных тегов на одном уровне в DOM. Структура ниже:

div.mcoup
    div.lcoup
    div.rcoup
        div.rcoupmeta
            a.rcoupedit
            a.rcoupdelete
    div.updcoup
    div.delcoup

А вот скрипт, который я использую:

    $('div.delcoup').hide();
    $('a.rcoupdel').click(function() {
        $(this).parent().parent().next('div.delcoup').slideToggle(400);
        $('div.updcoup').slideUp(400);
        $('div.crecoup').slideUp(400);
        return false;
    });

    $('div.updcoup').hide();
    $('a.rcoupedit').click(function() {
        $(this).parent().parent().next('div.updcoup').slideToggle(400);
        $('div.delcoup').slideUp(400);
        $('div.crecoup').slideUp(400);
        return false;
    });

Странная вещь здесь - это то, что a.rcoupedit правильно нацелен на div.updcoup и влияет на него, в то время как с тем же кодом a.rcoupdelete, похоже, ничего не делает с div.delcoup. Это делает slideUp другие элементы, хотя. Я думал, что из a.rcoupdelete нам нужно подняться на два уровня, а затем найти следующий div с классом delcoup. Очевидно, что-то не так.

Как правильно настроить таргетинг на этот div.delcoup?

Answer 1

.next() специально выбирает следующий элемент в DOM (на том же уровне). Версия .updcoup работает правильно, потому что, действительно, после нахождения родителя родителя якоря (т. Е. div.rcoup) элемент .next() равен div.updcoup.

Для просмотра всех элементов, которые идут после выбранного, используйте .nextAll():

$(this).parent().parent().nextAll('div.delcoup').slideToggle(400);