title: Select multiple paths with Snap.svg
body: <p><strong>Background</strong>: I'm using snap.svg to animate paths in an inline svg, and I'm trying to animate several paths in one function.</p>
  
  <p><strong>Problem</strong>: using the code below, I'm only able to select a single path in one grab function. In the code below, I've used multiple selectors, but the animation only affects rect#rect-one. How can I select multiple paths in Snap.svg? </p>
  
  <p>Thanks for the help!</p>
  
  <p><strong>HTML/Inline SVG</strong>:</p>
  
  <pre><code>&lt;a id="one"&gt;link&lt;/a&gt;
  
  &lt;svg&gt;
  &lt;rect  id="rect-one" fill="#231F20" width="39" height="14"/&gt;
  &lt;rect id="rect-two" x="54" fill="#231F20" width="39" height="14"/&gt;
  &lt;rect id="rect-three" x="104" fill="#231F20" width="39" height="14"/&gt;
  &lt;/svg&gt;
  </code></pre>
  
  <p><strong>Snap</strong>:</p>
  
  <pre><code>window.onload = function () {
      var grabLink = Snap.select('body a#one'),
          grabPathRectangles = Snap.select('#rect-one, #rect-two, #rect-three');
  
      function colorPathRectangles(){
          grabPathRectangles.animate({fill: 'red'}, 100, mina.ease);
      } 
      function resumePathRectangles(){
          grabPathRectangles.animate({fill: 'green'}, 100, mina.ease);
      }   
      grabLink.hover(colorPathRectangles, resumePathRectangles);  
  };
  </code></pre>