jquery - 需要 jQuery 代码来查找包含 ul 且元素超过 3 个的 div

Question

我需要 jQuery 代码，我可以用它来查找 div，它是至少一个 ul 的直接父级，而 ul 又包含 3 个以上的元素。当找到这样的 div 时，它应该将类名 target 添加到它。

例如，如果我有以下 HTML 代码:

JSFiddle 在这里: http://jsfiddle.net/AvkY5/

<div class="main">
  <div class="main_child_1">
    <ul>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
    </ul>
    <ul>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
    </ul>
  </div>
  <div class="main_child_2">
    <ul>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
    </ul>
  </div>
  <div class="main_child_3">
    <p>Lorem Ipsum</p>
  </div>
  <div class="main_child_4">
    <ul>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
    </ul>
    <div class="main_child_4_child_1">
      <p>Lorem Ipsum</p>
    </div>
    <div class="main_child_4_child_2">
      <ul>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
      </ul>
    </div>
  </div>
  <div class="main_child_5">
    <p>Lorem Ipsum</p>
    <div class="main_child_5_child_1">
      <p>Lorem Ipsum</p>
    </div>
    <div class="main_child_5_child_2">
      <ul>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
      </ul>
    </div>
  </div>
  <div class="main_child_6">
    <ul>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
      <li>Lorem Ipsum</li>
    </ul>
    <div class="main_child_6_child_1">
      <p>Lorem Ipsum</p>
    </div>
    <div class="main_child_6_child_2">
      <ul>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
        <li>Lorem Ipsum</li>
      </ul>
    </div>
    <div class="main_child_6_child_3">
      <p>Lorem Ipsum</p>
    </div>
  </div>
</div>

然后在这段代码中，以下 div 应该将 target 添加到它们的类名中:

• main_child_2
• main_child_4
• main_child_5_child_2
• main_child_6_child_2

什么 jQuery 代码可以实现这个？

Answer 1

怎么样

$("div").filter(function() {
    return $(this).children("ul li").length > 3;
}).addClass("target");