$('#tm1').puitieredmenu();
<ul id="mb1" >
<li >
<ul >
<li />
<li />
</ul >
</li >
<li />
<li />
</ul >
$('#tm1').puitieredmenu();
$('#tm2').puitieredmenu({
autoDisplay: false
});
$('#tm3').puitieredmenu({
popup: true,
trigger: $('#tm3trigger')
});
$('button').puibutton();
<h3 class="first">Default</h3>
<ul id="tm1">
<li> <a data-icon="fa-file-o">File</a>
<ul>
<li><a data-icon="fa-plus">New</a>
<ul>
<li><a>Project</a></li>
<li><a>Other</a></li>
</ul>
</li>
<li><a>Open</a></li>
<li><a>Quit</a></li>
</ul>
</li>"
<li> <a data-icon="fa-edit">Edit</a>
<ul>
<li><a data-icon="fa-mail-forward">Undo</a></li>
<li><a data-icon="fa-mail-reply">Redo</a></li>
</ul>
</li>
<li>
<a data-icon="fa-question">Help</a>
<ul>
<li><a>Contents</a></li>
<li>
<a data-icon="fa-search">Search</a>
<ul>
<li><a>Text</a>
<ul>
<li><a>Workspace</a></li>
</ul>
</li>
<li><a>File</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a data-icon="fa-gear">Actions</a>
<ul>
<li><a data-icon="fa-refresh">Edit</a>
<ul>
<li><a data-icon="fa-save">Save</a></li>
<li><a data-icon="fa-save">Update</a></li>
</ul>
</li>
<li><a data-icon="fa-phone">Other</a>
<ul>
<li><a data-icon="fa-minus">Delete</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a data-icon="ui-icon-close">Quit</a>
</li>
</ul>
<h3>Click Trigger</h3>
<ul id="tm2">
<li> <a data-icon="fa-file-o">File</a>
<ul>
<li><a data-icon="fa-plus">New</a>
<ul>
<li><a>Project</a></li>
<li><a>Other</a></li>
</ul>
</li>
<li><a>Open</a></li>
<li><a>Quit</a></li>
</ul>
</li>
<li> <a data-icon="fa-edit">Edit</a>
<ul>
<li><a data-icon="fa-mail-forward">Undo</a></li>
<li><a data-icon="fa-mail-reply">Redo</a></li>
</ul>
</li>
<li>
<a data-icon="fa-question">Help</a>
<ul>
<li><a>Contents</a></li>
<li>
<a data-icon="fa-search">Search</a>
<ul>
<li><a>Text</a>
<ul>
<li><a>Workspace</a></li>
</ul>
</li>
<li><a>File</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a data-icon="fa-gear">Actions</a>
<ul>
<li><a data-icon="fa-refresh">Edit</a>
<ul>
<li><a data-icon="fa-save">Save</a></li>
<li><a data-icon="fa-save">Update</a></li>
</ul>
</li>
<li><a data-icon="fa-phone">Other</a>
<ul>
<li><a data-icon="fa-minus">Delete</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a data-icon="ui-icon-close">Quit</a>
</li>
</ul>
<h3>Overlay</h3>
<button id="tm3trigger" style="margin-top:0px">Show</button>
<ul id="tm3">
<li> <a data-icon="fa-file-o">File</a>
<ul>
<li><a data-icon="fa-plus">New</a>
<ul>
<li><a>Project</a></li>
<li><a>Other</a></li>
</ul>
</li>
<li><a>Open</a></li>
<li><a>Quit</a></li>
</ul>
</li>
<li> <a data-icon="fa-edit">Edit</a>
<ul>
<li><a data-icon="fa-mail-forward">Undo</a></li>
<li><a data-icon="fa-mail-reply">Redo</a></li>
</ul>
</li>
<li>
<a data-icon="fa-question">Help</a>
<ul>
<li><a>Contents</a></li>
<li>
<a data-icon="fa-search">Search</a>
<ul>
<li><a>Text</a>
<ul>
<li><a>Workspace</a></li>
</ul>
</li>
<li><a>File</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a data-icon="fa-gear">Actions</a>
<ul>
<li><a data-icon="fa-refresh">Edit</a>
<ul>
<li><a data-icon="fa-save">Save</a></li>
<li><a data-icon="fa-save">Update</a></li>
</ul>
</li>
<li><a data-icon="fa-phone">Other</a>
<ul>
<li><a data-icon="fa-minus">Delete</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a data-icon="ui-icon-close">Quit</a>
</li>
</ul>