title: How to loop an animation without a maximum call back error jQuery?
body: <p>I am trying to animate these two shapes up and down but only the first shape will animate and the other one won't and I get a &quot;Maximum call stack exceeded error&quot;</p>
  <p>JavaScript function</p>
  <pre><code>function loopAnimation(shape, cssProperty, moveVal) {
              $(shape)
              .animate({[cssProperty]: &quot;+=&quot; + moveVal}, 1000)
              .animate({[cssProperty]: &quot;-=&quot; + moveVal}, 1000)
              loopAnimation(shape, cssProperty, moveVal);
          };
  </code></pre>
  <p>Function call</p>
  <pre><code>loopAnimation(cube, &quot;top&quot;, &quot;75%&quot;);
  loopAnimation(triangle, &quot;bottom&quot;, &quot;75%&quot;);
  </code></pre>