JSFiddle - React, Tailwind, and code Playground

by David Brierton

HTML

<div id="google_translate_element"></div>
                           

<script type="text/javascript">
			function googleTranslateElementInit() {
				new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.InlineLayout}, 'google_translate_element');
			}
		</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

CSS

.goog-te-gadget .goog-te-combo {
    margin: 0px 0px;
}
.goog-logo-link {
  display:none !important;
} 
.goog-te-gadget{
  color: transparent !important;
  font-size:0px;
}

.goog-te-combo { 
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
  color: #687074;
  cursor:pointer;
}

JavaScript

$(document).ready(function() {
 $('.goog-te-combo').change(function(){
    $(".goog-te-combo").html($('.goog-te-combo option:selected').text());
    $(this).width($(".goog-te-combo").width());  
 });
});