jQuery - переключать выбранные элементы

У меня проблема с задачей jQuery. Я должен переключить контекст 'ol' после нажатия на заголовок:

Мой HTML:

<h3>Task</h3>
    <ul>...</ul>
    <ol>...</ol>

<h3>Second Task</h3>
    ...

Мой скрипт jQuery:

$(document).ready(function() {
    $('h3').click(function() {
        $(this).nextUntil('h3').toggle(); 
    })
})

Мой код переключает весь контекст между заголовками h3, но мне нужно переключить только 'ol'. Большое спасибо за помощь.

1 ответ

Решение

Ты можешь использовать .last() переключить только последний элемент в коллекции (который является ol в этом случае).

Обновление: на случай, если после вашего <ol> лучше использовать .filter('ol') чтобы убедиться, что вы нацелены только на нужный список.

$(document).ready(function() {
    $('h3').click(function() {
        $(this).nextUntil('h3').filter('ol').toggle(); 
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h3>Task</h3>
    <ul><li>list1-1</li><li>list1-2</li></ul>
    <ol><li>list2-1</li><li>list2-2</li></ol>

<h3>Second Task</h3>

Другие вопросы по тегам