无法在jQuery中触发onclick事件

我无法在jQuery中单击以切换div的类

预期的行为:我想在汉堡菜单中添加close类,以使其在单击时成为十字形,并希望为移动屏幕显示一个叠加层,但是目前,我只想弄清楚如何触发此onclick事件。

这是我用来执行此操作的代码:

$("#mobile-menu").click(function() {
  $(".icon").toggleClass("close");
  var x = document.getElementsByClassName("overlay")[0];
  if ($(".icon").hasClass("close")) {
    x.style.display = "block";
    $("body").addClass("modal-open");
  } else {
    x.style.display = "none";
    $("body").removeClass("modal-open");
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mobile-menu">
  <div class="icon">
    <span class="line top"></span>
    <span class="line middle"></span>
    <span class="line bottom"></span>
  </div>
</div>