Select dropdown inputting more than one select. Javascript

Question

I am trying to get my select to only print one address instead of two. When I select TMobile, it will do the print to the input just fine. However, if I also select Verizon, it will also add the Verizon address next to it.

 <select class='cellBox' id='cellSelection'>
  <option value='@tmomail.next'>TMobile</option>
  <option value='@vzwireless.com'>Verizon</option>
 </select>
 <input type='text' class='histBox' id='resultCell'>

Here is my javascript:

 var dropdown2 = document.getElementById('cellSelection2');
 var textbook2 = document.getElementById('resultCell2');
 dropdown2.onchange = function(){
                        textbook2.value += this.value;
                      }

Answer 1

  var dropdown2 = document.getElementById('cellSelection'); var textbook2 = document.getElementById('resultCell'); dropdown2.addEventListener("change",function(){ textbook2.value = dropdown2.value; }); 

 <select class='cellBox' id='cellSelection'> <option value='@tmomail.next'>TMobile</option> <option value='@vzwireless.com'>Verizon</option> </select> <input type='text' class='histBox' id='resultCell'> 

Answer 2

Because you are concatenating the dropdown value in the onchange event.

Change from textbook2.value += this.value; to textbook2.value = this.value;