Remove input field

Hi everybody,

I have the following problem:

HTML Code:

<p id="tipo_de_cambio_selected"></p>

JS Code:

function tipo_de_cambio(){

	var value = document.getElementById("moneda").value;
	if (value == "USD") {
 	    
		$.ajax({
			url : 'https://www.banxico.org.mx/SieAPIRest/service/v1/series/SF43718/datos/oportuno?token=[elided by staff]',
			jsonp : 'callback',
			dataType : 'jsonp', //Se utiliza JSONP para realizar la consulta cross-site
			success : function(response) {  //Handler de la respuesta
				var series=response.bmx.series;
			
				for (var i in series) {
					  var serie=series[i];
					  
					  var reg='<input type="form-control" class="form-control" id="tipo_de_cambio_selected" name="tipo_de_cambio_selected" value="'+serie.datos[0].dato+'" readonly>'					  
					  $('#tipo_de_cambio_selected').append(reg);
				}
			}
		});
	}
	if (value == "MXN") {

		var reg='<input type="form-control" class="form-control" id="tipo_de_cambio_selected" name="tipo_de_cambio_selected" value="1.0000" readonly>'					  
		$('#tipo_de_cambio_selected').append(reg);		
	}

	if (value == "EUR") {

		$.ajax({
			url : 'https://www.banxico.org.mx/SieAPIRest/service/v1/series/SF46410/datos/oportuno?token=c891d1fa219745b6ffe7ec17a2e7c74a3b10dd5e8eed03644ed32770867d823f',
			jsonp : 'callback',
			dataType : 'jsonp', //Se utiliza JSONP para realizar la consulta cross-site
			success : function(response) {  //Handler de la respuesta
				var series=response.bmx.series;
			
				for (var i in series) {
					  var serie=series[i];
					  
					  var reg='<input type="form-control" class="form-control" id="tipo_de_cambio_selected" name="tipo_de_cambio_selected" value="'+serie.datos[0].dato+'" readonly>'					  
					  $('#tipo_de_cambio_selected').append(reg);
				}
			}
		});
	}

};

Depending on the selected value, the code gets some data of the Banco de Mexico, which works fine.

But everytime I change the value, the code creates an additional text field, instead of replacing the value in the same input field.

Any ideas how to replace the value in the existing input field, without creating any additional lines or fields?

Thanks for your support!!

This is because you append the new value to the p-tag.

Just replace it with innerHTML instead.

Thank you very much Thallius, works perfect!

var reg='<input type="form-control" class="form-control" id="tipo_de_cambio_selected" name="tipo_de_cambio_selected" value="'+serie.datos[0].dato+'" readonly>'					    
document.getElementById('tipo_de_cambio_selected').innerHTML=reg;