JSFiddle - React, Tailwind, and code Playground

by Carlos Quintero

HTML

<a href="#" name="Argentina" onClick="pais(this.id)" id="0"><img src="http://www.nocturnar.com/imagenes/bandera-argentina-png-Argentina3.png"/></a>
<a href="#" name="Bolivia" onClick="pais(this.id)" id="1"><img src="http://www.fancyicons.com/free-icons/103/flags/png/128/bolivia_flag_128.png"/></a>
<a href="#" name="Ecuador" onClick="pais(this.id)" id="2"><img src="http://www.fancyicons.com/free-icons/103/flags/png/128/ecuador_flag_128.png"/></a>
<a href="#" name="Venezuela" onClick="pais(this.id)" id="3"><img src="http://icdn.pro/images/es/b/a/bandera-de-venezuela-icono-4196-128.png"/></a><br><br>

<input type="text" name="pais"/>

JavaScript

function pais(X){

/*Array de paises*/
var ar = ["Argentina","Bolivia","Ecuador","Venezuela"];

//Ubicamos el valor del atributo name del enlace en el array y si existe lo cargamos en la variable
var index = $.inArray( $("a[id="+X+"]").attr('name'),ar );

//verificamos que la variable sea mayor, ya que en el array los index inician en 0
if(index > -1){
	
  //si es mayor cargamos el resultado en el campo
	$("input[name=pais]").val($("a[id="+X+"]").attr('name'))

}else{

//si no alertamos al usuario
	alert("El pais no se encuentra")

}

}