function DataLoad() {

  var id = $(#TourId).val();

  $(#Details).load('/umbraco/Surface/Tour/GetTourDetails?tourId=' + id);

}

$(document).ready(function () {

  DataLoad();

  $(#ulGenres li a).on(click, function () {

    // Get text from anchor tag

    var id = $(this).data('pdsa-dropdown-val');

    $(#TourId).val(id);

    // Add text and caret to the Select button

    var text = $(this).text();

    $(#selectButton).html(text + '&nbsp;<span class=caret></span>');

    // Put text into hidden field from model

    $(#SelectedText).val(text);

    DataLoad();

  });

  var id = $(#TourId).val();

  $(#ulGenres li a).filter([data-pdsa-dropdown-val= + id + ]).trigger(click);

  //$(#ulGenres li:first-child a).trigger(click);

});

<link href=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css rel=stylesheet />

<script src=https://code.jquery.com/jquery-2.1.4.js></script>

<script src=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js>

</script>



<input id=TourId type=text value=2 />

<div class=dropdown>

  <button class=btn btn-primary id=selectButton data-toggle=dropdown>

    Arrangement

    <span class=caret></span>

  </button>

  <ul class=dropdown-menu scrollable-menu id=ulGenres>

    <li>

      <a href=# data-pdsa-dropdown-val=1>Item 1</a>

    </li>

    <li>

      <a href=# data-pdsa-dropdown-val=2>Item 2</a>

    </li>

    <li>

      <a href=# data-pdsa-dropdown-val=3>Item 3</a>

    </li>

  </ul>

</div>