bootstrap drop down set selected value

I have a Bootstrap drop down list

<button class="btn btn-primary" id="selectButton" data-toggle="dropdown">
  Arrangement
  <span class="caret"></span>
</button>
<ul class="dropdown-menu scrollable-menu" id="ulGenres">
  @foreach (var item in Model.Tours)
  {
  <li>
    <a href="#" data-pdsa-dropdown-val="@item.Id">@item.StringValue</a>
  </li>
  }
</ul>

I would like to set selected item

function DataLoad() {
  var id = $("#TourId").val();
  $("#Details").load('/umbraco/Surface/Tour/GetTourDetails?tourId=' + id);
}
$(document).ready(function () {
  $("#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").data("[pdsa-dropdown-val= " + id + "]").trigger("click");
  //$("#ulGenres li:first-child a").trigger("click");
});

This does not select the correct the element the wanted element

$("#ulGenres li a").data("[pdsa-dropdown-val= " + id + "]")