I want to count the sibling by classes,

html,

<div class=item-sibling>1</div>

<div class=item-holder><div class=item-sibling>2</div></div>

<div class=item-holder><div class=item-sibling>3</div></div>

<div class=item-holder><div class=item-sibling>4</div></div>

<div class=item-holder><div class=item-sibling>5</div></div>​

jquery,

var len = $('.item-sibling').siblings().css({background:'red'}).length;

alert(len);​​​​ // return 4

it does not include <div class=item-sibling>1</div>

how can I include it?

jsfiddle link

and if I change the html to,

<div class=item-sibling>0</div>

<div class=item-sibling>1</div>

<div class=item-holder><div class=item-sibling>2</div></div>

<div class=item-holder><div class=item-sibling>3</div></div>

<div class=item-holder><div class=item-sibling>4</div></div>

<div class=item-holder><div class=item-sibling>5</div></div>

I will get 6 this time. Strange!

EDIT,

<div class=group-a>

    <div class=item-sibling>1</div>

    <div class=item-holder><div class=item-sibling>2</div></div>

    <div class=item-holder><div class=item-sibling>3</div></div>

    <div class=item-holder><div class=item-sibling>4</div></div>

    <div class=item-holder><div class=item-sibling>5</div></div>​

</div>





<div class=group-b>

    <div class=item-sibling>1</div>

    <div class=item-holder><div class=item-sibling>2</div></div>

    <div class=item-holder><div class=item-sibling>3</div></div>

</div>

There are series of groups with the same class, and I want to count a targeted group's sibling dynamically for instance the first group.