Bootstrap ist ein HTML-, CSS- und JavaScript-Framework von den Twitter-Entwicklern.

Das Ausblenden bzw. Verstecken von Elementen bei bestimmten Bildschrimgrößen folgt in Bootstrap einem umgekehrten Denk-Ansatz: Bei welchen Bildschirmgrößen sind welche Elemente sichtbar?

Quelle: GitHub: Bootstrap: Issue #8883

$('#example-navbar-1').on('show.bs.collapse', function() {
	$('#example-navbar-1').append($('#sidebar').html());
	$('#example-navbar-1 ul').last().removeClass('nav-pills nav-stacked').addClass('navbar navbar-nav');
});
 
$('#example-navbar-1').on('hidden.bs.collapse', function() {
	$('#example-navbar-1 ul:last-child').remove();
});
 
$(window).on('resize', function() {
	if (window.innerWidth > 768) {
		$('#example-navbar-1').collapse('hide');
	}
});

Quelle: Stack Overflow: Bootstrap 3: Multiple menus collapse into one for mobile

• Bootstrap