jQuery count количество div с определенным классом внутри div с определенным классом

Question

Как я могу подсчитать количество div с классом item, которые находятся внутри div с классом outer-1? Результат здесь должен быть 7.

Я пробовал это и несколько других неудачных вариантов.

alert($(".outer-1").$(".item").length); 

Это дает мне 12 что все дивы на этой странице. alert($(".item").length);

Как я могу указать только outer-1 div?

Divs

<div class="outer-1"> 
    <div class="item">a</div> 
    <div class="item">b</div> 
    <div class="item">c</div> 
    <div class="item">d</div> 
    <div class="item">e</div> 
    <div class="item">f</div> 
    <div class="item">g</div> 
</div> 

<div class="outer-2"> 
    <div class="item">a</div> 
    <div class="item">b</div> 
    <div class="item">c</div> 
    <div class="item">d</div> 
    <div class="item">e</div> 
</div> 

Answer 1

Используйте find() селектор:

$(".outer-1").find(".item").length ; 

или

$(".outer-1 .item").length 

Answer 2

Для вашего HTML, $(".outer-1 .item").length будет достаточно, но если div.item s вложены, как это

<div class="outer-1"> 
    <div class="item">a</div> 
    <div class="item">b</div> 
    <div class="item">c</div> 
    <div class="item">d</div> 
    <div class="outer-x"> 
     <div class="item">h</div> 
     <div class="item">i</div> 
    </div> 
    <div class="item">e</div> 
    <div class="item">f</div> 
    <div class="item">g</div> 
</div> 

Вы можете использовать $(".outer-1 > .item").length (все div.item, которые ребенок div.outer-1).

See jsFiddle

Answer 3

если у вас есть куча боковин с тем же именем, вам может понадобиться в цикле:

$('.outer-1').each(function(){ 
    console.log($('.item',this).length); 
});