New to Kendo UI for jQuery? Start a free 30-day trial

InsertAfter

methods

Inserts a newly-created tab after a specified tab.

insertAfter

Parameters:itemArray|Object|String|Element|jQuery

Target tab(s), specified as a JSON object or array of objects. You can pass tab text, content or contentUrl here. Accepts also existing tab(s) specified as a string selector or jQuery object or DOM elements.

referenceTabString|Element|jQuery

A reference tab to insert the new item after.

Returns:kendo.ui.TabStrip

Returns the TabStrip object to support chaining.

<div id="tabstrip">
    <ul>
        <li>Tab</li>
    </ul>
    <div>Content</div>
</div>

<script>
    var tabStrip = $("#tabstrip").kendoTabStrip().data("kendoTabStrip");
    tabStrip.insertAfter(
        [{
            text: "Item 1",
            url: "https://www.telerik.com"               // Link URL if navigation is needed, optional.
        },
        {
            text: "<b>Item 2</b>",
            encoded: false,                             // Allows use of HTML for item text
            content: "text"                             // Content for the content element
        },
        {
            text: "Item 3",
            contentUrl: "https://demos.telerik.com/kendo-ui/content/web/tabstrip/ajax/ajaxContent1.html"
        },
        {
            text: "Item 4",
            imageUrl: "https://demos.telerik.com/kendo-ui/content/shared/icons/sports/baseball.png",
        },
        {
            text: "Item 5",
            spriteCssClass: "imageClass3"               // Item image sprite CSS class, optional.
        }],
        tabStrip.tabGroup.children().eq(0)
    );
</script>