Получить индекс jquery одного и того же класса элементов в разных контейнерах

В событии "click" я хотел бы получить индекс элемента, который может быть в нескольких контейнерах. Возвращаемое положение индекса должно быть рассчитано относительно его контейнера, а не тега тела.

Я написал пример здесь: http://jsfiddle.net/zUGcK/

Моя проблема в том, что когда я нажимаю на строки во втором контейнере блока, возвращаемый индекс строки: 3, 4, 5, тогда как я бы хотел вернуть 0, 1, 2.

Что мне следует изменить в аргументах jQuery index(), чтобы получить 0, 1, 2, возвращенные для каждой строки в обоих контейнерах?

Спасибо

http://jsfiddle.net/zUGcK/

$('.line').click(function()
{
    alert('index: '+$(this).index('.container .line'));
});

<div class="container">
<div class="header">block #1</div>
<div class="line">line #0</div>
<div class="line">line #1</div>
<div class="line">line #2</div>
</div>

<div class="container">
<div class="header">block #2</div>
<div class="line">line #0 (index 3 returned instead of 0)</div>
<div class="line">line #1 (index 4 returned instead of 1)</div>
<div class="line">line #2 (index 5 returned instead of 2)</div>
</div>

Ответ 1

Вы можете использовать это, чтобы получить значение индекса для элементов внутри контейнера

$(function()
{
    $('.line').click(function()
    {
        //alert('index: '+$(this).index('.container .line'));

        alert($(this).closest('.container').find('.line').index(this));
    });
});

Вы должны использовать этот синтаксис $. index

.index( element )
element The DOM element or first element within the jQuery object to look for.
​

Рабочий скрипт

Ответ 2

Обновлен индекс с $this.

 $('.line').click(function()
{
    var $this=$(this);
   var indx= $this.parent('.container').find('.line').index($this);

    alert('index: '+indx);
});