JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
<script type="text/javascript" src="http://codeorigin.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">

function myCallback(response){
alert(response.data)
 }

function fndtlang(){

	$.ajax({ // ajax call starts
        	url: 'http://ws.detectlanguage.com/0.2/detect',
data: {q: $('#hi').val(),
key:'b0bdb7f2dc45f5c71458dafc325498f7'
},
jsonpCallback: 'myCallback',
dataType: "jsonp",
          	success: myCallback,
		error: function(e,i,j){
			
$('#results').html(j)
		}
      });
}

function fndtlang_old(){
alert('hola');
	$.ajax({ // ajax call starts
        	url: 'http://ws.detectlanguage.com/0.2/detect',
data: {q: $('#hi').val(),
key:'b0bdb7f2dc45f5c71458dafc325498f7',
callback: '?'
},
jsonp:false,
jsonpCallback: 'myCallback',
          	dataType: 'jsonp', // Choosing a JSON datatype
crossDomain: true,
          	success: myCallback,
		error: function(e,i,j){
			
$('#results').html(j)
		}
      });
}

function hi(){
var module = (function($) {
    var request = function() {
        return $.ajax({
url: 'http://ws.detectlanguage.com/0.2/detect',
data: {q: $('#hi').val(),
key:'b0bdb7f2dc45f5c71458dafc325498f7'
},
           dataType: "jsonp"
        });
    }
    return { request: request };
})($);

module.request().done(function(result){
    alert(result);
});
}
</script>
</head>
<body>
<input type="text" rows="5" columns="20" id="hi"/>
<div id="results"></div>
<button onclick="fndtlang();">Detectar idioma</button>
<button onclick="hi();">Detectar idioma</button>
</body>
</html>

JavaScript

function myCallback(response){
alert(response.data)
 }

function fndtlang(){

	$.ajax({ // ajax call starts
        	url: 'http://ws.detectlanguage.com/0.2/detect',
data: {q: $('#hi').val(),
key:'demo'
},
jsonpCallback: 'myCallback',
dataType: "jsonp",
          	success: myCallback,
		error: function(e,i,j){
			
$('#results').html(j)
		}
      });
}