title: Differentiate h1 tags to be used in jquery
body: <p>I have two <strong>h1 tags</strong> with content <strong>heading</strong> and <strong>second heading</strong>.</p>
  
  <p>My problem is that when use jquery <code>both the h1 tags get activated</code>.  </p>
  
  <p>I <code>want the Second heading only to be used in jquery</code>.  How do i achieve it? </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code> function animateText() {
              TweenMax.from($('h1'), 0.8, {
                  scale: 0.4,
                  opacity: 0,
                  rotation: 15,
                  ease: Back.easeOut.config(4),
              });
          }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;h1 &gt;Heading&lt;/h1&gt;
  
  &lt;h1 &gt;second heading&lt;/h1&gt;</code></pre>
  </div>
  </div>
  </p>