jquery - 单击新 div 时切换另一个 div 的类。查询

Question

所以我有一个切换菜单，我正在添加一个搜索切换菜单，但我无法让 jquery 执行我想要的操作。

如果您单击搜索切换按钮，我希望显示搜索叠加层(我正在处理)，但我希望相同的 x 关闭按钮(来自主切换叠加层)出现在左上角，并且我希望搜索切换消失。

截至目前，当我关闭时它会返回到主叠加层，并且仍然显示非事件的主切换，而不是事件的 x。

这是我的实时网站:http://acetronaut.com

我要疯了...

JQuery:

// burger overlay menu
  $('.acetrnt-toggle').on('click',function(){
    $("#acetrnt-toggle-overlay").slideToggle();
    $(this).toggleClass('active');


  });

 // search toggle

  $('.acetrnt-search-toggle').on('click',function(){
    $("#acetrnt-search-overlay").fadeToggle();
    $(this).toggleClass('.acetrnt-toggle.active');
    $(this).hide('.acetrnt-toggle');

  });

Answer 1

试试这个:

$('.acetrnt-search-toggle').on('click',function(){
  var $icon = $('.acetrnt-search-toggle > i')
  $icon.toggleClass('fa-search fa-times');
  $('.acetrnt-toggle').hide()
});

编辑

Fiddle