Also, you need to add the same rel value to each of their tabbed-contents. In this example, box1 for header1 and header2’s content; and box3 for header3 and header4’s.

or

Finally this javascript should work:

var currentTab = 0; // Set to a different number to start on a different tab.
var namesTab = ["box1", "box2"];

function openTab(clickedTab) {
var thisTab = $(“.tabbed-box .tabs a”).index(clickedTab);
var thisRel = clickedTab.attr(“rel”);

$(“.tabbed-box .tabs li a[rel='"+thisRel+"']“).removeClass(“active”);
$(“.tabbed-box .tabs li a:eq(“+thisTab+”)”).addClass(“active”);
$(“.tabbed-box .tabbed-content[rel='"+thisRel+"']“).hide();
$(“.tabbed-box .tabbed-content:eq(“+thisTab+”)”).show();
currentTab = thisTab;
}

$(document).ready(function() {
$(“.tabs li:eq(0) a”).css(“border-left”, “none”);

$(“.tabbed-box .tabs li a”).click(function() {
openTab($(this)); return false;
});

for (i=0; i<namesTab.length; i++)
$(".tabbed-box .tabs li a[rel='"+namesTab[i]+"']:eq("+currentTab+")").click()
});

Does anyone have the java code to add multiple tabbed boxes to one page? I am not sure how to add separate functions. (new to java) :)