jquery - Kendo menu onSelect, how to determine the last child -

jquery - Kendo menu onSelect, how to determine the last child -

i'm working kendo ui menu widget, , trigger onselect event when lastly kid menu item has been selected:

for example, let's select "business group" menu item below. want trigger additional functions. however, if click on "report" don't want anything.

it's easy checking lastly child, i'm still trying figure out.

here's html code "kendo-menu" widget:

<div class="widget-content text-left text-info" style="float:left; border:none;"> <div class="widget-content" text-left text-info style="float:left; border:none; width:100px;"> <span> <ul kendo-menu style="display: inline-block" k-orientation="vm.menuorientation" k-rebind="vm.menuorientation" k-on-select="vm.onselect(kendoevent)" k-closeonclick="false"> <li> reports <ul> <li>var <ul> <li>business group</li> <li>stress scenarios</li> <li>ir risk - pv10</li> </ul> </li> <li>ctrpty <ul> <li> <a href="../index.html#/dashboard">industry</a> </li> <li> <a href="index.html#/dashboard?repttype='mtm'">mtm</a> </li> </ul> </li> </ul> </li> </ul> </span> </div>

in javascript controller code, wire event:

vm.onselect = function (ev) { changereporttype(ev); };

however fires every time click of menu items. i'd react on bottom item only.

i think can search ul descendants:

vm.onselect = function (e) { var isleaf = $(e.item).find("ul").length === 0; if (isleaf) changereporttype(ev); };

(demo)

jquery kendo-ui kendo-menu