自定义移动导航

我想写我自己的简单，动画移动导航…

我有一个基本的工作版本，但我不能让它正确地返回…

如果你点击"产品"，子菜单出现，在子菜单的顶部写着"<"产品"，一旦点击，菜单应该会滑出来，只是它什么也不做…

我不确定如果我的顶部功能是运行每次你点击任何链接?希望jsfiddle更有意义…

$('.mobile-nav ul.parent-level li').on('click', function (e) {
   $('ul.level-one').css('left', 0);
   e.preventDefault();
   console.log('clicked;');
});
 $('.mobile-nav ul.level-one li').on('click', function (e) {
   if (!$(this).hasClass('back-title')) {
       $('ul.level-two').css('left', 0);
   }
   e.preventDefault();
});
    //alert('go back');
   $(this).parent().css('left', '120px');
});