var asd = $('#aa ul li > ul')
        $('.es').click(function(){
            $(asd).css("display","inherit");
            if(asd.css("display") === "inherit"){
                asd.css("display","none")
            }
        })

<div id="aa">
            <ul>
                <li>Maain</li>
                <li>Maain</li>
                <li class="es">Maain
                    <ul>
                        <li>maain 2</li>
                    </ul>
                </li>
                <li>Maain</li>
                <li>Maain</li>
            </ul>

#aa {
            position: absolute;
            width:230px;
            height:100%;
            color:white;
            background: green;
            float:left;
        }

        #aa ul li {
            padding:12px;
            text-align: center;
            border-bottom: 1px solid white;
        }

        #aa ul li > ul {
            display: none;
        }