Question

I am using this solution to have multiple tabs in one page.

$(".tab_content").not(':first-child').hide();
var tabs = $('.tabs li');

tabs.filter(':first-child').addClass('active');

tabs.click(function() {
    var current = $(this);

    if(!current.hasClass('active')){
        current.addClass('active').siblings().removeClass('active');
        var activeTab = current.find("a").attr("href");
        current.parent().next().children().hide().filter(activeTab).fadeIn();
    }

    return false;
});

I need to place the tabs controls after the tab content.
But it won’t work. If tabs controls placed before the tabs content, it works fine.
Can you help me?

Here is my jsfiddle:

Answer 1

just change next() to prev() – since now the sibling is previous to the tabs

current.parent().prev().children().hide().filter(activeTab).fadeIn();

http://jsfiddle.net/Kf2f4/