jquery - 单击时无法使用jquery更改显示值

Question

当屏幕小于 35em 时，我试图制作简单的按钮来显示和隐藏菜单。但问题是我的 jQuery 点击事件不会改变我的列表项的显示值。

CSS：

div{
  list-style:none;
  width:100%;
  text-align:center;
}
ul li{
  display:inline-block;
}
#menuToggle {
  display:none;
}
@media screen and (max-width: 35em) {
  #menuToggle {
    display:block;
    cursor:pointer;
  } 
  ul li{
    display:none;
  }
}

jQuery：

$('#menuToggle').click(function(){
  $('ul li').css('display','block');
}

演示：http: //jsfiddle.net/bLamG/

我怎样才能确定这一点？

Answer 1

您的代码应该可以工作，但是您没有关闭);，因此您的代码会引发语法错误。试试这个：

$('#menuToggle').click(function () {
    $('ul li').css('display', 'block');
});

更新的小提琴

Answer 2

你错过了结束);

您还应该改用“on”方法。

$('#menuToggle').on('click', function () {
     $('ul li').css('display', 'block');
});