JSFiddle - React, Tailwind, and code Playground

HTML

<header>
</header>
<body>
<ul class = 'contentMenu jsGeneralNavigation'>
<li>Menu Item 1</li>
<li>Drop Down Menu 1
<ul>
<li>No Select</li>
<li>
<select>
<option value ='Option 1'>Option 1</option>
<option value ='Option 2'>Option 2</option>
<option value ='Option 3'>Option 3</option>    
</select>
<li>No Select</li>
</ul>
</ul>
<br/><br/><br/><br/><br/><br/><br/><br/>    
<p style = 'clear:both; margin-top:50px'>1. Select the "Drop down menu 1"</p>
<br/><br/>     
<p>2. Try and select a option from the select. As soon as you try and select an option the menu will disappear.</p>
<br/><br/>     
<p>This menu worked in Chrome 39 but no longer works in Chrome 41.0.2272.118. This menu will work in FireFox 37.01. This menu will work in Safari 5.1.7. Bug also occurs in I.E. 11</p>    
</body>

CSS

/******************************************************
* CSS Reset
* http://meyerweb.com/eric/tools/css/reset/ 
* v2.0 | 20110126
******************************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*************************************************************
* End CSS Reset
*************************************************************/

ul.contentMenu li {
    float: left;
	position: relative;    
    list-style: none;
    text-align: center;    
    color: #000;
    cursor: default;
    display: block;
    font-size: 12px;
    text-decoration: none;
	padding:5px;
	border-radius: 3px 3px 0px 0px;
	border: 1px #ddd solid;
	border-bottom:0px;
    background-color: #F0F0F0;
    margin-right: 5px;
}

ul.contentMenu li.pesudoClassHover  {
    background-color: #ddd;
}

ul.contentMenu ul {
	z-index: 10;
	display: none;
	position: absolute;
	top: 22px;
	left: -1px;
    box-shadow: 5px 5px 5px #aaa;
    border-top:1px solid #ddd;
    border-top-right-radius: 3px;  
    border-bottom-left-radius: 3px;
 ...

JavaScript

$(document).ready(function() 
{
		//Javascript for desktop navigation
		$('ul.jsGeneralNavigation li').on('mouseover', function() 
		{					
			$(this).addClass('pesudoClassHover');
			$(this).children('ul').show();
		});   

		//Javascript for desktop navigation
		$('ul.jsGeneralNavigation li').on('mouseleave', function() 
		{
			$(this).removeClass('pesudoClassHover');
			$(this).children('ul').hide();
		});	  
});