var tabs       = [];
var tabContent = [];
var current    = null;

function Tab(element) {
    this.element = element
    this.tabContent = null
}


$(document).ready(
    function() {
        $('.tab').each(
            function(i) { 
                $(this).addClass('inactive');
                var tab = new Tab($(this));
                
                $(tab.element).click(
                    function() { 
                        showTab(i);
                    }
                )
                
                tabs.push(tab);
            }
        );

        $('.tab-content').each(
            function(i) { 
                $(this).hide();
                tabs[i].tabContent = $(this);
            }
        );

        for(i in tabs) {

            if (tabs[i].tabContent.html() ==  "") {
                $(tabs[i].element).remove();
                $(tabs[i].tabContent).remove();
                //tabs.splice(i, 1);
            }
        }

        showTab(0);
    }
);

function showTab(index) {
    if (current != null) {
        tabs[current].element.addClass('inactive').removeClass('active');
        tabs[current].tabContent.hide();
    }
    
    tabs[index].element.addClass('active').removeClass('inactive');
    tabs[index].tabContent.show();
    current = index;
}