[Solved]-Swap a D3.js created drop down menu into a HTML created drop down menu-d3.js

Since you're creating the drop down in the HTML, you don't need to append anything using D3.

Thus, drop this:

var select = d3.select('#opts')
    .append('select')
    .on('change',function() { update(this.value) });

And simply add an event listener to the dropdown:

d3.select("#opts").on("change", function() {
    //code here
});

Here is a demo:

d3.select("#opts").on("change", function() {
  console.log(this.value)
});

<script src="https://d3js.org/d3.v4.min.js"></script>
<select id="opts">
  <option>Please select</option>
  <option value="ds1">1</option>
  <option value="ds2">2</option>
  <option value="ds3">3</option>
</select>