title: Add class to body for each scrolling based on section ID
body: <p>I have a page layout like this.</p>
  
  <pre><code>&lt;body&gt;
    &lt;section id="s1"&gt;...&lt;/div&gt;
    &lt;section id="s2"&gt;...&lt;/div&gt;
    &lt;section id="s3"&gt;...&lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>I need to add class to body tag whenever the <code>&lt;section&gt;</code> meet the top by scrolling. like <code>&lt;body class="s1"&gt;</code> for <code>#s1</code> section and <code>&lt;body class="s2"&gt;</code> for <code>#s2</code>. How this can be done using jquery? </p>
  
  <p>Please help.</p>