开发者

jQuery selector to get last child that doesnt have a class

I have a page of nested ULs and LIs, I need to get the last LI of each UL, so I'm doing:

$('li:last-child')

this works great.

But I need to extend this so it gets the last child LI of each UL, wher开发者_JS百科e the LI doesn't have a given class (x). For example:

<ul>
    <li class="x">1</li>
    <li>2</li>
    <li class="x">3</li>
    <li>4</li>
    <li>5</li>
    <li class="x">
        6
        <ul>
            <li class="x">7</li>
            <li>8</li>
            <li class="x">9</li>
            <li>10</li>
            <li>11</li>
            <li class="x">12</li>
            <li class="x">13</li>
        </ul>
    </li>
</ul>

I need to return LI 5 and 11 (as these are the last children within their parent ul that don't have .x)

How can I do this elegantly?


Use the map()(docs) method to create a jQuery object by iterating over the <ul> elements, and returning the last child <li> element without an x class.

Example: http://jsfiddle.net/e2Da7/2/

var lastLisNoX = $('ul').map(function() {
    return $(this).children('li:not(.x)').get(-1);
});

EDIT: Updated my jsFiddle example with the HTML that was posted in the question.


Filter out the elements with a class.

$('li:not(.x):last-child')

If the classes are different amongst the li elements, that is if all the elements are not class="x" then something like

$('li[class=""]:last-child')
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜