title: Change text after scrolling
body: <p>Hello I got a question regarding changing a text after a user scrolled the page.</p>
  
  <p>How can I change the text of my <code>h1</code> from YES to NO when a user scrolled?I have tried several things like <code>.append()</code>, <code>.html()</code> but with no succes.</p>
  
  <p>My code: <a href="http://jsfiddle.net/m1oasnkg/2/" rel="nofollow">JSFIDDLE</a></p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;h1&gt;YES&lt;/h1&gt;
  
  &lt;article style="height: 1000px"&gt;
      &lt;p&gt;test&lt;/p&gt;
  &lt;/article&gt;
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$(document).ready(function () {
  
      $(window).scroll(function () {
          if ($(this).scrollTop() &gt; 100) {
              //change yes to no
          } else {
              //set h1 text to yes
          }
      });
  });
  </code></pre>
  
  <p>The reason I want this is because in the case of using <code>.html()</code>, I can add inline html objects like: <code>.html('&lt;span&gt;yes&lt;/span&gt;')</code></p>