insertAfter
Inserts a PanelBar item after the specified referenceItem
Example
<ul id="panelbar">
<li>Item 1
<ul>
<li>Sub Item 1</li>
<li>Sub Item 2</li>
<li>Sub Item 3</li>
</ul>
</li>
<li>Item 2
<ul>
<li>Sub Item 1</li>
<li>Sub Item 2</li>
<li>Sub Item 3</li>
</ul>
</li>
</ul>
<script>
$("#panelbar").kendoPanelBar();
var panelBar = $("#panelbar").data("kendoPanelBar");
panelBar.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/panelbar/ajax/ajaxContent1.html"
},
{
text: "Item 4",
imageUrl: "https://demos.telerik.com/kendo-ui/content/shared/icons/sports/baseball.png",
expanded: true, // item is rendered expanded
items: [{ // Sub item collection.
text: "Sub Item 1"
},
{
text: "Sub Item 2"
}]
},
{
text: "Item 5"
}],
"li:first-child"
);
</script>
Parameters
item String|Element|jQuery|Array
Target item, specified as a JSON object. You can pass item text
, content
or contentUrl
here. Can handle an HTML string or array of such strings or JSON.
referenceItem String|Element|jQuery
A reference item to insert the new item after