Javascript JQuery不显示/隐藏元素

我只是想让JQuery显示/隐藏一个div。我尝试过使用Javascript，但仍然不起作用。我已经进行了测试，以确保我的JS脚本中的任何地方都可以访问。它只是不适用，我不知道为什么。谢谢你能给我的帮助

Javascript

$(document).ready(function() {
  startup();
  $('select').material_select();
  $('ul.tabs').tabs();
  $('.collapsible').collapsible({
    accordion: false // A setting that changes the collapsible behavior to expandable instead of the default accordion style
  });
});

function startup() {
  $("#Assignments").hide();
  $("#ClassView").hide();
}

$('.datepicker').pickadate({
  selectMonths: true, // Creates a dropdown to control month
  selectYears: 15 // Creates a dropdown of 15 years to control year
});

function tabswitch(x) {
  if (x == 1) {
    $("#Calender").show();
    $("#Assignments").hide();
    $("#ClassView").hide();
  } else if (x == 2) {
    $("#Calender").hide();
    $("#Assignments").show();
    $("#ClassView").hide();
  } else if (x == 3) {
    $("#Calender").hide();
    $("#Assignments").hide();
    $("#ClassView").show();
  }
}

CSS

HTML

HTML元素的ID前面不应该有
#
。它只是在CSS选择器中用于引用它们

替换

<div id="#Assignments" class="col s9">
    <p>Assignment Test</p>
</div>
<div id="#ClassView" class="col s9">
    <p>Class Test</p>
</div>


作业测试

课堂测试


与


作业测试

课堂测试


它应该可以工作。
您的HTML元素的ID前面不应该有
。它只是在CSS选择器中用于引用它们

替换

<div id="#Assignments" class="col s9">
    <p>Assignment Test</p>
</div>
<div id="#ClassView" class="col s9">
    <p>Class Test</p>
</div>


作业测试

课堂测试


与


作业测试

课堂测试


它应该能用。
我已经更改了你的代码。请查看这是否是您想要的：

[在此处输入链接说明][1]

只需更改id名称

[1] ：
在此处输入代码
我已更改了您的代码。请查看这是否是您想要的：

[在此处输入链接说明][1]

只需更改id名称

[1] ：
在此处输入代码
您是否尝试过检查元素以确保样式应用于它们，以及查看哪些css规则可能会覆盖它，从而强制隐藏或不隐藏它？您是否尝试过检查元素以确保样式应用于它们，还要看看什么css规则可能会覆盖它，迫使它隐藏还是不隐藏？
<div id="#Assignments" class="col s9">
    <p>Assignment Test</p>
</div>
<div id="#ClassView" class="col s9">
    <p>Class Test</p>
</div>

<div id="Assignments" class="col s9">
    <p>Assignment Test</p>
</div>
<div id="ClassView" class="col s9">
    <p>Class Test</p>
</div>