Please make option to close back long category list!

Hi! Please see attached screenshot. You have an option in the header builder to hide cateries in category’s widget, but I guess it is obvious if user could open long list of cateroies he may want to close it back without page reload.

I tried to do it by myself. And added some css and js to the theme options:

.wd-show-cat .wd-less-cat-btn > a {
    display: block;
	  padding: 10px;
    font-weight: 600;
    font-size: 12px;
    line-height: 1;
	  background-color: #F2F2F2;
		text-align: center;
}
.wd-show-cat .wd-less-cat-btn>a:after {
    content: "\f115";
	  font-family: woodmart-font;
}

.vertical-navigation .item-level-0.wd-moren-cat-btn>a {
	  display: block;
    padding: 10px;
    font-weight: 600;
    font-size: 12px;
    line-height: 1;
		text-align: center;
}
.vertical-navigation .item-level-0.wd-moren-cat-btn:hover>a {
    background-color: #F2F2F2;
}
.wd-moren-cat-btn>a:after {
    content: "\f129";
    font-family: woodmart-font;
}

jQuery('.wd-more-cat-btn a').on('click', function (e) {
	e.preventDefault();
	jQuery(this).parent('li').removeClass('wd-more-cat-btn').addClass('wd-less-cat-btn');
});

setTimeout(function(){
	var wdlessbtn = jQuery('header').find('.wd-less-cat-btn a');
	wdlessbtn.on('click', function (e) {
		e.preventDefault();
		jQuery('.wd-more-cat').removeClass('wd-show-cat');
		jQuery(this).parent('li').removeClass('wd-less-cat-btn').addClass('wd-moren-cat-btn');
});
 }, 3000);
setTimeout(function(){
	var wdmorebtn = jQuery('header').find('.wd-moren-cat-btn a');	
	wdmorebtn.on('click', function (e) {
		e.preventDefault();
		jQuery('.wd-more-cat').addClass('wd-show-cat');
		jQuery(this).parent('li').removeClass('wd-moren-cat-btn').addClass('wd-less-cat-btn');
});
 }, 3000);

– but js is conflicting with theme js files and I don’t want to change them itself in case of next updates. Please help me!