title: Fade In and Fade Out text inside a div
body: <p>I have a div with a CSS style to show it as a button:</p>
  
  <pre><code>&lt;div id="Word1" class="btn green" onclick="WordClicked(1);"&gt;Word 1&lt;/div&gt;
  </code></pre>
  
  <p>And CSS styles:</p>
  
  <pre><code>.btn {
      display: inline-block;
      background: url(btn.bg.png) repeat-x 0px 0px;
      padding: 5px 10px 6px 10px;
      font-weight: bold;
      text-shadow: 1px 1px 1px rgba(255,255,255,0.5);
      text-align: center;
      border: 1px solid rgba(0,0,0,0.4);
      -moz-border-radius: 5px;
      -moz-box-shadow: 0px 0px 2px rgba(0,0,0,0.5);
      -webkit-border-radius: 5px;
      -webkit-box-shadow: 0px 0px 2px rgba(0,0,0,0.5);
  }
  
  .green      {background-color: #CCCCCC; color: #141414;}
  </code></pre>
  
  <p>I want to fade out text inside div, change text, and then fade in text again. But I don't want to fade in and fade out div.</p>
  
  <p>If I use this javascript code:</p>
  
  <pre><code>$('#Word1').fadeOut('fast');
  </code></pre>
  
  <p>I will fade out div and text inside.</p>
  
  <p>How can I do that?</p>