title: jQuery translate + toggle, how to link the two?
body: <p>I'm currently working on a jQuery script that will translate the site's text into a foreign language . I'm utilizing Google Translate API for this. I would like the page to include a link that says En Espanol and when the user clicks on En Espanol, the body of the page gets translated into Spanish with the exception of that link which says In English - when the user clicks on that link, the body of the page will revert back to English. The following code below is what I have so far. Any help will be greatly appreciated. Thank you.</p>
  
  <p>JQuery:</p>
  
  <pre><code>$(document).ready(function(){
        // hide all blocks that have class hide
          //$('.hide').hide();
          // toggle link1 with container1
          // using chaining for performance and ease
          // changing html of link
          $('.showhide').toggle(function(){
            //$(this).parent().next().slideDown('slow').removeClass('hide').preventDefault;
              $(this).html('English');
            },function(){
              //$(this).parent().next().slideUp('slow').addClass('hide').preventDefault;
              $(this).html('En Espanol');
          })
  
       });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;p&gt;&lt;a id="link1" class="showhide" href="#container1" onclick="translate('es');"&gt;
  En Espanol&lt;/a&gt;&lt;/p&gt;
  &lt;!--Calls Google Translate via div --&gt;
  &lt;div id="translation"&gt;&lt;/div&gt;
  &lt;div id="article"&gt;
  &lt;p&gt;Google Inc is set to introduce on Tuesday a new Web browser designed to handle text
  and graphics.&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>