Multi level DropDown Menu using Bootstrap and CSS

Dear Bhavesh,

Kindly refer below sample.

HTML

<div class="dropdown">
    <a id="dLabel" role="button" data-toggle="dropdown" class="btn btn-primary" data-target="#" href="/page.html">
        Products <span class="caret"></span>
    </a>
    <ul class="dropdown-menu " role="menu" aria-labelledby="dropdownMenu">
        <li><a href="#">Menu-1</a></li>
        <li><a href="#">Menu-2</a></li>
        <li class="dropdown-submenu">
            <a tabindex="-1" href="#">Menu-3</a>
            <ul class="dropdown-menu">
                <li class="dropdown-submenu">
                    <a href="#">A</a>
                    <ul class="dropdown-menu">
                        <li><a href="#">A-1</a></li>
                        <li><a href="#">A-2</a></li>
                    </ul>
                </li>
                <li><a href="#">B</a></li>
                <li><a href="#">C</a></li>
            </ul>
        </li>
    </ul>
</div>

CSS

b.dropdown-submenu {
    position: relative;
}

.dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
}

.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}

.dropdown-submenu > a:after {
    display: block;
    content: " ";
    float: right;
    border-color: transparent;
    border-style: solid;
    border-left-color: #ccc;
}

.dropdown-submenu:hover > a:after {
    border-left-color: #fff;
    background-color:cadetblue;
}

Screenshot