title: Waypoints and Inview, tracking multiple elements using wildcard selector
body: <p>I have multiple sections on a page with id's like <code>ss-section-story</code> <code>ss-section-problem</code> <code>ss-section-solution</code> and I am trying to track when each of those sections enter and exit the viewport. The problem is, with the current code I have it is only tracking the first section with the id <code>ss-section</code>. I want to be able to track <em>each</em> section entering and exiting.</p>
  
  <p>JS</p>
  
  <pre><code>var inview = new Waypoint.Inview({
  element: $('section[id^="ss-section"]')[0],
  enter: function(direction) {
    console.log(this.element.id + ' enter');
  },
  entered: function(direction) {
    console.log(this.element.id + ' entered');
  },
  exit: function(direction) {
    console.log(this.element.id + ' exit');
  },
  exited: function(direction) {
    console.log(this.element.id + ' exited');
  }
  })
  </code></pre>
  
  <p>I know it must be only tracking the first section because on the <code>element</code> option it is restricted to <code>[0]</code> in that array but when I remove that, I will get undefined on those console.log statements. </p>
  
  <p>What I would want to be able to do it something like but this but judging from the docs, it has no syntax like this :</p>
  
  <pre><code>$('section[id^="ss-section"]').Waypoint.Inview({
  enter: function(direction) {
    console.log(this.element.id + ' enter');
  },
  entered: function(direction) {
    console.log(this.element.id + ' entered');
  },
  exit: function(direction) {
    console.log(this.element.id + ' exit');
  },
  exited: function(direction) {
    console.log(this.element.id + ' exited');
  }
  })
  </code></pre>
  
  <p>Any suggestions on how I can track each individual section using just one instantiation of the <code>Waypoint.Inview</code></p>