JQuery Slide Toggle not triggering

Question

Я пытаюсь выполнить jquery slidetoggle, но у меня возникают проблемы с его запуском. Пожалуйста, проверьте на скрипке. https://jsfiddle.net/2yL2Q/63/

Когда я нажимаю на класс флип, он ничего не делает.

Пример кода

<div class="some-div"> 
<div class="flip">Click to slide the panel down or up</div> 
</div> 
<div class="panel">Hello world!</div> 

<div class="some-div"> 
<div class="flip">Click to slide the panel down or up</div> 
</div> 
<div class="panel">Hello world!</div> 

<div class="some-div"> 
<div class="flip">Click to slide the panel down or up</div> 
</div> 
<div class="panel">Hello world!</div> 

Script

$(document).ready(function() { 
    $(".some-div .flip").click(function() { 
     $(this).next('.panel').slideToggle("slow"); 
    }); 
}); 

Answer 1

Вы пытаетесь выбрать .panel элемент, следующий смежный родственный к щелкнули .flip элемента. Ваша разметка должна будет выглядеть следующим образом для того, чтобы ваш Jquery работать:

<div class="flip">Click to slide the panel down or up</div> 
<div class="panel">Hello world!</div> 

Так эти элементы не являются родственниками в HTML вы предоставили, вы должны пройти через DOM и выберите родительский элемент. Просто используйте .parent() method:

Updated Example

$(".some-div .flip").click(function() { 
    $(this).parent().next('.panel').slideToggle("slow"); 
}); 

В качестве альтернативы, если глубина/вложенность элементов изменяется, можно также использовать .closest() method:

Updated Example

$(".some-div .flip").click(function() { 
    $(this).closest('.some-div').next('.panel').slideToggle("slow"); 
});