Jquery DOM中所有匹配元素的索引问题

我意识到这可能是这个的复制品

我试图选择具有相同类的任何元素的当前索引

这是我的问题的一个例子。

我遵循了另一个问题中的建议，但是在第二组元素上，我仍然收到一个'-1'

HTML

试一试

---

演示：

谢谢，这很有意义。

<div class="members">
    <div class="row">
        <div class="col-sm-3 ">
            <div class="member">
                <span>Name</span>
                <span>Last Name</span>
                <span>Position</span>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="member">
                <span>Name</span>
                <span>Last Name</span>
                <span>Position</span>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="member">
                <span>Name</span>
                <span>Last Name</span>
                <span>Position</span>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="member">
                <span>Name</span>
                <span>Last Name</span>
                <span>Position</span>
            </div>
        </div>                                          
    </div>
</div>
<div class="profiles">
    <div class="profile active">
        <div class="row">
            <div class="bio col-md-6">
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean tempor et sapien non vestibulum. Ut dictum arcu libero, eu aliquet massa bibendum id. Sed a venenatis nisl, id pretium purus. Phasellus porta faucibus arcu in pellentesque. Maecenas viverra, lectus quis euismod cursus, elit magna blandit augue, nec tincidunt lectus orci sed nunc. Suspendisse est justo, ullamcorper in leo sed, facilisis varius tellus. 
                </p>
            </div>
            <div class="photo col-md-6">
            </div>
        </div>
    </div>
    <div class="profile"></div>
    <div class="profile"></div>
    <div class="profile"></div>
    <div class="profile"></div>
    <div class="profile"></div>
    <div class="profile"></div>
    <div class="profile"></div>
    <div class="profile"></div>
</div>
<div class="members">
    <div class="row">
        <div class="col-sm-3 ">
            <div class="member">
                <span>Name</span>
                <span>Last Name</span>
                <span>Position</span>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="member">
                <span>Name</span>
                <span>Last Name</span>
                <span>Position</span>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="member">
                <span>Name</span>
                <span>Last Name</span>
                <span>Position</span>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="member">
                <span>Name</span>
                <span>Last Name</span>
                <span>Position</span>
            </div>
        </div>                                          
    </div>
</div>

$(document).ready(function(){
    $('.member').click(function() {

        $('.member').removeClass('active');
        $(this).addClass('active');

        var members = $('.member');

        var current = members.index($('.active'))
        $('#index').html(current);

    });
});

$(document).ready(function(){
    var members = $('.member').click(function() {
        members.removeClass('active');
        $(this).addClass('active');

        var current = members.index(this); //pass the dom reference here
        $('#index').html(current);
    });
});