JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <form id="form1" runat="server">
    <div align="center">
        <div align="center" style="width: 1000px">
            <div class="topRightBand">
                4/4/2012            </div>
            <div class="topLeftBand">
                <div id="navcontainer">
                    <ul id="navlist">
                        <li><a href="#" id="lblUserName">User</a></li>
                        <li><a href="#" >Exit</a></li>
                    </ul>
                </div>
            </div>
            <div id="Specifications">
            wq  we  q
            </div>
                            </div>
        <div class="topMenuBand">
        </div>
        <div id="content">
            &nbsp;
        </div>
        <div class="botBand">
           dwddqwd</div>
    </div>
    </form>
</body>

CSS

a
        {
            color: #340000;
            text-decoration: none;
        }
        a:hover
        {
            color: #457DD0;
            background-color:#FFA530;
        }
        
        #navlist 
        {
            float: left;
            margin-left: 20px;
            border-bottom:1px solid #FFA530;
        }
        
        #navlist li
        {
            display: inline;
            list-style-type: none;
            padding-right: 20px;
            
        }
        #navlist li a
        {
            border-top-left-radius: 4px;
            border-top-right-radius: 4px;
            height: 18px;
            line-height: 21px;
            padding: 0 12px;
            vertical-align:top;
            
        }
        #Specifications
        {
            background-color:#FFA530;
            width:1000px;
            display:none;
            height:80px;
        }

JavaScript

$(document).ready(function () {
            $('#lblUserName').on('click', function () {
                $('#Specifications').slideToggle();
            });
        });