JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<div class="row">
<div class="col-md-3">
<div class="titulo">
<span class="glyphicon glyphicon-plus" id=""></span>
<ul class="dropdown-menu">
<li><a href="#">Agregar etiqueta</a></li>
<li><a href="#">Agregar separador</a></li>
</ul>
</div>
</div>
<div class="col-md-9">
<ul class="nav nav-tabs">
<li class="active"><a aria-expanded="true" href="#view1" data-toggle="tab"><span class="glyphicon glyphicon-th-large"></span></a></li>
<li class=""><a aria-expanded="false" href="#view2" data-toggle="tab"><span class="glyphicon glyphicon-th-list"></span></a></li>
</ul>
<div id="myTabContent" class="tab-content">
<div class="dropdown">
<span id="willtoggle" class=" glyphicon glyphicon-align-left"></span>
<ul id="toggled" class="dropdown-menu" aria-labelledby="dropdownMenu1">
...
CSS
.button{
padding:10px;
}
#willtoggle:hover,#willtoggletoo:hover{cursor:pointer;}/* Thanks to loli */
.hidden{
display:none;
}
JavaScript
$('#willtoggle').on('click', function (event) {
$("#toggled").toggle();
});
$(document).on('click', function(event) {
if ($(event.target).closest('.dropdown').length === 0) {
$("#toggled").hide();
}
});