<div class="row">
  <ul class="tabs main-tab nav-tabs" data-tabs id="shop-main-tabs">

     <li class="tabs-title is-active"><a href="#info1" aria-selected="true" ><i class="fi-torso"> Add Participant</i></a></li>

     <li class="tabs-title main-tab" ><a href="#" class="add-form"><i class="fi-plus">+</i></a></li>

</ul>

</div>

$(".tabs-content").append('<div class="tabs-panel is-active" id="' + tabId + '">' + $("#info1").html() + '</div>');

//Find the parent "ul" that contains the tabs
var target = document.getElementById("shop-main-tabs");
var options = {
    "linkClass": "tabs-title"
};

//Use the target "ul" to initialize the "Tabs" object.
var elem = new Foundation.Tabs($(target), options);

//Find the tab that will be selected
var tab = document.getElementById(tabId);
elem.selectTab($(tab));