jquery - 如何过滤必须具有多个类的元素

Question

HTML：

<div class="scrollBlock" tabIndex="4">
        <ul id="dropdown-reg-phone-type">
            <li>
                <div class="header tzSelected">Home</div>
                <div class="optkey">0</div>
            </li>
            <li>
                <div class="header">Work</div>
                <div class="optkey">1</div>
            </li>
            <li>
                <div class="header">Cell</div>
                <div class="optkey">2</div>
            </li>
        </ul>
    </div>

jQuery：

var $listItems = $('li');


var $selected = $listItems.filter('div.header.tzSelected'),
console.dir($selected);

if (!$selected.length) {
    console.log("selected doesn't exist");
}

即使有一个具有 .tzSelected 类的 div，这也会返回“选定的不存在”。我猜过滤器设置不正确，但不知道为什么。$listItems是正确的; 然后从那里我需要找到div同时具有header和tzSelected类的。

console.dir 行显示了这一点：

Answer 1

.filter()直接作用于 中的li元素$listItems，而不是它们中的元素。如果您尝试选择他们的后代，则需要使用.find()：

var $selected = $listItems.find('div.header.tzSelected')

Answer 2

对于您的特定情况，您应该能够完全使用选择器本身来完成它：

var $selected = $('li div.header.tzSelected');