Помогите, пожалуйста, не отменяется событие ссылки и не выполняется функция. Консоль проверил и не каких ошибок(включая присвоение display) нету. Уже перепробовал все варианты и не один не сработал.
HTML
...
<div class="container">
<a href="#" id="touch-menu" onclick="return open()">Меню</a>
<nav>
<ul class="nav clearfix">
<li><a href="#">Текст_1</a></li>
<li><a href="#">Текст_2</a></li>
<li><a href="#">Текст_3</a></li>
<li><a href="#">Текст_4</a></li>
<li><a href="#">Текст_5</a></li>
</ul>
</nav>
</div>
<script type="text/javascript">
function open(){document.querySelector('.nav').style.displa y = "block"; return false;}
</script>
...
CSS
* {
margin: 0;
padding: 0;
outline: none;
clear: both;
}
.container {
max-width: 960px;
margin: 0 auto;
}
#touch-menu {
background: #3e4156;
}
.nav li a, #touch-menu {
text-decoration: none;
display: block;
padding: 10px 15px;
font-weight: bold;
font-size: 14px;
color: #fff;
}
#touch-menu:hover {
background: #515572;
}
.nav {display: block;}
.nav li a {
border-top: 1px solid #eee;
border-left: 3px solid transparent;
background: #fff;
color: #666;
}
.nav li:first-child a {border-top: none;}
.nav li a:hover {
background: #f0f0f0;
color: #444;
border-left: 3px solid #515572;
}