title: How to rotate individual SVG elements with jQuery/Javascript?
body: <p>I have a SVG with repeated rectangle shapes. On scroll, each rectangle should individually rotate.
  The problem I'm having is that the entire SVG block rotates, and not individually. </p>
  
  <p>Is it possible to target the script to treat each rectangle as an individual element to rotate?</p>
  
  <p>Here is my: <a href="https://jsfiddle.net/24afjmxd/" rel="nofollow">JSFiddle</a></p>
  
  <p>Here is a rotation solution I found somewhere, but it affects the entire SVG:</p>
  
  <pre><code>$(function() {
  
    var sdegree = 0;
  
    $(window).scroll(function() {
  
    sdegree ++ ;
    sdegree = sdegree + 2 ;
    var srotate = "rotate(" + sdegree + "deg)";
    $("rect").css({"-moz-transform" : srotate, "-webkit-transform" : srotate});
    });
  
  });
  </code></pre>