JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="nav navbar-nav navbar-border-bottom navbar-right">	
  <li class="">
     <div id="google_translate_element"></div>
      <select class="dup-goog-te-combo">
         <option class="dup-goog-te-combo-option"></option>
      </select>
  </li>
</ul>  
<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;
}

.goog-te-combo {
 width: 130px;
} 
 
.dup-goog-te-combo{
 display : none;
}

JavaScript

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