JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css">
<ul id="main-nav">
    <li class="first"><a href="" title="">Item</a>

        <ul>
            <li class="first"><a href="" title="">Item 1</a>

                <ul>
                    <li class="first"><a href="" title="">Item 2</a>
                    </li>
                    <li><a href="" title="">Item</a>
                    </li>
                    <li><a href="" title="">Item</a>
                    </li>
                    <li><a href="" title="">Item</a>
                    </li>
                    <li class="last"><a href="" title="">Item</a>
                    </li>
                </ul>
            </li>
            <li><a href="" title="">Item</a>

                <ul>
                    <li class="first"><a href="" title="">Item</a>
                    </li>
                    <li class="last"><a href="" title="">Item</a>
                    </li>
                </ul>
            </li>
            <li class="last"><a href="" title="">Item</a>

                <ul>
                    <li class="first"><a href="" title="">Item</a>
                    </li>
                    <li><a href="" title="">Item</a>
                    </li>
                    <li class="last"><a href="" title="">Item</a>
                    </li>
                </ul>
            </li>
        </ul>
    </li>
    <li><a href="" title="">Item</a>
    </li>
</ul>

CSS

.ui-menu {
        width: 200px;
    }

JavaScript

$("#main-nav").menu();

    $("#main-nav li").mouseover(function () {
        $("#main-nav li ul li.first ul").show();
    });