В jQuery, как мне выбрать элементы между элементами с определенными классами?

У меня есть неупорядоченный список.

<ul>
    <li class="foo">Baz</li>
    <li>Select Me!</li>
    <li>Select Me!</li>
    <li>Select Me!</li>
    <li class="bar">Baz</li>
    <li>Don't Select Me</li>
    <li>Red Herring List Item</li>
</ul>

Как выбрать элементы списка между элементами списка с помощью классов foo и bar с помощью jQuery? Я не знаю содержание каких-либо элементов списка. Я также не знаю, сколько элементов списка должно быть выбрано, поэтому я не могу зависеть от количества.

Ответ 1

$('li.foo').nextUntil('li.bar')

http://jsfiddle.net/zZRDB/1/

Ответ 2

var $elements = $('.bar').prevUntil('.foo');

Или другим способом:

var $elements = $('.foo').nextUntil('.bar');

Демо

Если вы заинтересованы в том, как это реализовать, проверьте исходный код:

nextUntil: function(elem, i, until) {
    return jQuery.dir(elem, "nextSibling", until);
},
prevUntil: function(elem, i, until) {
    return jQuery.dir(elem, "previousSibling", until);
},

dir: function(elem, dir, until) {
    var matched = [],
        cur = elem[dir];

    while (cur && cur.nodeType !== 9 && (until === undefined || cur.nodeType !== 1 || !jQuery(cur).is(until))) {
        if (cur.nodeType === 1) {
            matched.push(cur);
        }
        cur = cur[dir];
    }
    return matched;
},

Ответ 3

Попробуйте,

 $('li.bar').prevUntil('.foo')

DEMO

Ответ 4

var index1 = $('li.foo').index(),
    index2 = $('li.bar').index()-1;

    $('li:gt('+ index1+'):lt('+ index2+')', 'ul');

или $('li.foo').nextUntil('li.bar');

или $('li.bar').prevUntil('li.foo');