title: Modifying output of google.translate.TranslateElement.InlineLayout.VERTICAL
body: <p>I've read this answer <a href="https://stackoverflow.com/questions/9306015/modifying-element-from-google-translate-translateelement-results">Modifying element from google.translate.TranslateElement results</a> as well as others dealing with modifying the style and loading of the Google Translate translate element.</p>
  <p>The difference with my usage is that I'm using <code>layout: google.translate.TranslateElement.InlineLayout.VERTICAL</code> instead of <code>SIMPLE</code>; all of the other answers deal with <code>SIMPLE</code>.</p>
  <p>One issue I'm having is using <code>.fadeIn</code> on the <code>google-translate</code> div doesn't work. I still get a flash of text from <code>.goog-logo-link</code> and I see <code>Select a Language</code> before it changes to <code>Translate</code>.</p>
  <p>That might have something to do with the <code>myTimer</code> function from <a href="https://stackoverflow.com/questions/9306015/modifying-element-from-google-translate-translateelement-results">Modifying element from google.translate.TranslateElement results</a> . But <code>myTimer</code> the only way I figured out how to change the text of <code>.goog-te-combo option:first</code> from <code>Select a Language</code> to <code>Translate</code>.</p>
  <p>So,</p>
  <ol>
  <li><p>Is there a more efficient way to change the text of <code>.goog-te-combo option:first</code> from <code>Select a Language</code> to <code>Translate</code>?</p>
  </li>
  <li><p>how can I get <code>.fadeIn</code> to work on the <code>google-translate</code> div so that changing the text from <code>Select a Language</code> to <code>Translate</code> and hiding <code>.goog-logo-link</code> is hidden until the entire div is faded in?</p>
  </li>
  </ol>
  <p>jsfiddle: <a href="https://jsfiddle.net/gfzcjwmv/7/" rel="nofollow noreferrer">https://jsfiddle.net/gfzcjwmv/7/</a></p>
  <pre><code>&lt;script&gt;
  $(window).on('load', function() {
  $(&quot;.goog-logo-link&quot;).empty();
  $('.goog-te-gadget').html($('.goog-te-gadget').children());
  $(&quot;#google-translate&quot;).fadeIn('1000');
  });
  &lt;/script&gt;
  
  
  &lt;div id=&quot;google-translate&quot;&gt;
  
  &lt;div id=&quot;google_translate_element&quot;&gt;&lt;/div&gt;
  
  &lt;script type=&quot;text/javascript&quot;&gt;
  function googleTranslateElementInit() {
  new google.translate.TranslateElement({
  pageLanguage: 'en', includedLanguages: 'af,ach,ak,am,ar,az,be,bem,bg,bh,bn,br',
  layout: google.translate.TranslateElement.InlineLayout.VERTICAL
  }, 'google_translate_element');
  }
  &lt;/script&gt;
  
  &lt;script type=&quot;text/javascript&quot; src=&quot;https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit&quot;&gt;&lt;/script&gt;
  
  &lt;/div&gt;
  
  
  &lt;script&gt;
  
  $(window).on('load', function() {
  
  function cleartimer() {     
      setTimeout(function(){ 
          window.clearInterval(myVar); 
      }, 1000);             
  }
  function myTimer() {
      if ($('.goog-te-combo option:first').length) {
          $('.goog-te-combo option:first').html('Translate');
          cleartimer();
      }
  }
  var myVar = setInterval(function(){ myTimer() }, 300); 
  
  });
  
  &lt;/script&gt;
  </code></pre>