bootstrap not showing dropdown

Question

I have a bootstrap form that I have added a dropdown list. When I click on the dropdown I see the list, but when I click on it doesn't show as selected it still shows "select Domain" all the time. I found this link

https://www.codeply.com/go/pTWA3jYWEv/bootstrap-bootstrap-dropdown-selected-value

I have modified it, but I am missing something cause it is not working for me.

<div class="form-group">
<div class="dropdown">
  <button class="btn btn-primary btn-user btn-block dropdown-toggle" type="button"
          id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Select Domain
      <span class="caret"></span>
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <a class="dropdown-item">Corp</a>
    <a class="dropdown-item">Domain2</a>
    <a class="dropdown-item">Domain3</a>
    <a class="dropdown-item">Local</a>
  </div>
</div>
</div>


<script type="text/javascript">
$(".dropdown-menu li a").click(function(){
  var selText = $(this).text();
  $(this).parents('.dropdown').find('.btn btn-primary btn-user btn-block dropdown-toggle').html(selText+' <span class="caret"></span>');
});
</script>