Bootstrap JQuery SubMenu导航隐藏/显示

Question

全部，

我构建了一个工作水平导航，其子菜单基于以下示例：Horizontal Menu Hide/Show

作为一个独立的网站，一切都很好，但是，我将其整合到一个内容管理系统中，出于某种原因，JQuery必须有冲突。

单击链接时，将显示子导航，但是，如果单击另一个导航链接，它将打开另一个子菜单，但不会关闭上一个子菜单。

有没有人知道重写JQuery的方法，以便它基本上做同样的事情？我希望我可以简单地改变脚本，而不是想出一个完全不同的方法。

更新：我发现我放置代码的CMS系统正在运行JQuery 1.8.2，我的程序在JQuery 2.x中正常运行。我刚刚创建了一个使用这个版本的JQuery的JsFiddle，现在你可以看到发生了什么。我无法在系统中升级JQuery，因此我需要以某种方式使我的代码在旧版本中运行。请协助。

$(document).ready(function() {
    $('.collapse').on('shown.bs.collapse', function (e) {
        $('.collapse').not(this).removeClass('in');
    });

 $('[data-toggle=collapse]').click(function (e) {
     $('[data-toggle=collapse]').parent('li').removeClass('active');
     $(this).parent('li').toggleClass('active');
 });

$('li a').click(function(){
$(this).next('ul').slideToggle('500');
$(this).find('i').toggleClass('fa-plus-circle fa-minus-circle')
});