Activate a disabled tab

[umbe1987]

I have one of my tabs set to disabled by default.

<li class="disabled"><a href="#info" role="tab"><i class="fa fa-info" aria-hidden="true"></i></a></li>

I'd like to activate it when a checkbox in another tab is clicked like.
This is the other tab:

<li><a href="#settings" role="tab"><i class="fa fa-gear"></i></a></li>
<div class="sidebar-pane" id="info">
                <h1 class="sidebar-header">Info<span class="sidebar-close"><i class="fa fa-info" aria-hidden="true"></i></span></h1>
            </div>

and the code I am using right now is:

var info_class = $("a[href$='#info']").first().parent();
var info_class_off = info_class.attr('class');

$("#info_settings").on('change', function() {
    if (this.checked) {
        // remove "class "disabled" (show panel)
        info_class.removeClass(info_class_off);
        alert(info_class.attr('class'));
    } else {
        // add "class "disabled" (hide panel) this is default
        info_class.addClass(info_class_off);
        alert(info_class_off);
    }
})

alerts are there just to debug. So apparently, I am removing and adding the disabled class from the li element, but I suppose this is not enough to change the already hidden status of my info tab. Is there a sidebar method I am supposed to call instead? I just couldn't find it...

Thanks in advance for this beautiful project!

[umbe1987]

Ok, just found it out! I had simply to remove set the li class to disabled.
This is the working example:

$("#info_settings").on('change', function() {
    if (this.checked) {
        // remove "class "disabled" (show panel)
        info_class.removeClass(info_class_off);
    } else {
        // add "class "disabled" (hide panel) this is default
        info_class_off = 'disabled';
        info_class.addClass(info_class_off);
    }
})