"Untitled"
Bootstrap 4.1.1 Snippet by jeres

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="dropdown"> <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> Dropdown <span class="caret"></span> </button> <ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> <li><a href="#" data-value="action">Action</a></li> <li><a href="#" data-value="another action">Another action</a></li> <li><a href="#" data-value="something else here">Something else here</a></li> <li><a href="#" data-value="separated link">Separated link</a></li> </ul> </div>
$(".dropdown-menu li a").click(function(){ $(this).parents(".dropdown").find('.btn').html($(this).text() + ' <span class="caret"></span>'); $(this).parents(".dropdown").find('.btn').val($(this).data('value')); });

Related: See More


Questions / Comments: