Javascript changes to options of select do not apply

I am programming a Rails app with a view with inline JavaScript also using jquery. When clicking the button with Id="ReloadPlaceholders" the script is executed which is fine, wanted and works.

The script itself doesnt work. It is supposed to:

  1. load data from the server [WORKS]
  2. select a drop down [WORKS]
  3. empty the drop down with [DOESN’T WORK – The drop down options remain unchanged (but the drop down flickers shortly…dunno why)
  4. Populate the drop down with the new options. To test this I added an Option [DOESN’T WORK] (later the options from the var will be loaded)

My code in the view:

<script>
                      document.getElementById("ReloadPlaceholders").addEventListener("click",
                          function(){
                            const xmlHttp = new XMLHttpRequest();
                            xmlHttp.open( "GET", "/home/companies/<%= current_company.id %>/disbursements/placeholders", true ); // false for synchronous request
                            xmlHttp.onload = (e) => {
                              var options = xmlHttp.responseText;
                              let newOption = new Option('Option Text','Option Value');
                              const select = document.querySelector('#disbursement_disbursement_positions_attributes_0_placeholder_id');
                              select.empty();
                              select.add(newOption, undefined);
                            };
                            xmlHttp.onerror = (e) => {
                                console.error(xmlHttp.statusText);
                            };
                          }
                      );
                  </script>

I tried for multiple hours also using plain vanilla JS but it doesnt work.