How to make values show up in input boxes

This is my first time coding, and I’m trying to create a feature on my website where after I select an item from the dropdown menu, values corresponding to that item will show up in the input boxes I created. An example is if I select “apples” from my dropdown menu, the values “1.2” and “4.00” will show up in the “Pounds” and “Cost” input boxes respectively.

I already have code written using HTML and JS for the dropdown menu and input boxes, and I have stored the data corresponding to the items in a csv file. Right now, values show up in the input boxes only because I wrote code for that in JS. Is there any way for the HTML file to read my data from a csv file and display that data in my input boxes? Below is what I have so far.

<div id="cs-element">
  <label id="cs-element-label">Elements</label>
</div>

<select onChange="dropdownTip(this.value)" name="search_type" style="margin-right:10px; margin-top:2px;">
 <option selected="selected">Choose Element</option>
 <option>Methane</option>
 <option>Ethane</option>
 <option>Propane</option>
 <option>n-Butane</option>
</select>

<div id="result"></div>

<script type="text/javascript">
 function dropdownTip(value){
   console.log(value);
    document.getElementById("myText").value="190.6";
    document.getElementById("myText1").value="45.99";
    document.getElementById("myText2").value="0.012";
 }
</script>

<div id="cs-tc" class="col-sm-4 text-center">
  <label id="cs-tc-label" class="control-label">Critical Temperature (K)</label>
 <input type="text" id="myText" value=" " class="form-control" name="cs_tc">
</div>

<div id="cs-pc" class="col-sm-4 text-center">
  <label id="cs-pc-label" class="control-label">Critical Pressure (atm)</label>
  <input type="text" id="myText1" value=" " class="form-control" name="cs_pc">
</div>

<div id="cs-acc" class="col-sm-4 text-center">
  <label id="cs-acc-label" class="control-label">Accentric Factor</label>
  <input type="text" id="myText2" value=" " class="form-control" name="cs_acc">
</div>

<script>
$(document).ready(function() {
  $.ajax({
    type: "GET",
    url: "B1_1.csv", //read csv file
    dataType: "text",
    success: function(data) {processData(data);}
   });
});

function processData(allText) {
 var allTextLines = allText.split("/\r\n|\n/");
 var headers = allTextLines[0].split(',');
 var lines = [];

 for (var i=1; i<allTextLines.length; i++) {
  var data = allTextLines[i].split(',');
  if (data.length == headers.length) {

   var tarr = [];
   for (var j=0; j<headers.length; j++) {
    tarr.push(headers[j]+":"+data[j]);
   }
   lines.push(tarr);
  }
 }
}
</script>

How to make values show up in input boxes