How to set selected option by using JavaScript or jQuery in data-bind select option

Question

I bind-data in select option,

<select 
  id="TanentNamesDB"
  data-bind="
  value:SelectedOrganisationData,
  event: { change: ConnectSelectedOrganization } ,
  options: GridAllOrganisationDataList,
  optionsText:'TenantName',optionsCaption: 'Choose your organisation ...',
  optionsId:'SelectTenantName'
   "
   class="dropdown">
 </select>

It looks like this,

And, how to change the selected value using javascript or jquery, When I change the option manually it will automatically update to the database,

I tried different, different way like,

<script type="text/javascript">
    var SelectOp = document.getElementById('TanentNamesDB');
    SelectOp.selectedOption(TanentNameSelected);

    $("#TanentNamesDB option[text='BD']").attr("selected", "selected");
    $("#TanentNamesDB").setSelectedOption("BD");
</script>

Answer 1

You can target an option containing some text and which is child of id TanentNamesDB , like this:

 $("#TanentNamesDB option:contains('BD')").prop("selected", true)

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <select id="TanentNamesDB"> <option disabled>Choose your organisation...</option> <option>BDML</option> <option>BD</option> <option>hSenid Au Solutions</option> </select>