bootstrap dropdown submenu

bootstrap dropdown submenu

<li class="dropdown-submenu action-menu-item">
	<span href="#" class="dropdown-toggle" data-toggle="dropdown">
		Point
	</span>
	<ul class="dropdown-menu">
    Some points
	</ul>
</li>



$('.dropdown-submenu').on('click', function(event) {

    //cancel dropdown closing
    event.stopPropagation();
    if ($(this).hasClass('open')) {
        $('.dropdown-submenu').removeClass('open');
    } else {
        $('.dropdown-submenu').removeClass('open');
        $(this).addClass('open');
    }
});



.dropdown-submenu:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #cccccc;
    margin-top: 2px;
}
.dropdown-submenu {
    cursor: pointer;
    position: relative;
}
.dropdown-submenu .dropdown-menu{
    box-shadow: -2px -2px 12px rgba(0,0,0,.175);
	top: 105%;
    left: 15px;
}