两个div 里面的item用jq循环

Question

<div class="head">
    <span class="head-item head-item-1 current"></span>
    <span class="head-item head-item-2"></span>
    ……
    <span class="head-item head-item-n"></span>
</div>
<div class="content">
    <span class="content-item content-item-1 fn-block"></span>
    <span class="content-item content-item-2"></span>
    ……
    <span class="content-item content-item-n"></span>
</div>

.head-item-n，.click()之后，.addClass('current')，对应的.content-item-n .addClass('fn-block')，.head-item起到选项卡的功能。

Answer 1

虽然写了一个，可是真的很麻烦啊，不如用jQuery的Tab插件。

$('head-item').click(function() {
    $('.current').removeClass('current');
    $('.fn-block').removeClass('fn-block');
    $(this).addClass('current');
    $('.content-item-'+$(this).attr('class').split(' ')[1].split('-')[2]).addClass('fn-block');
}