title: jQuery dynamic search results from an array
body: <p>I have a created dynamic search that takes data from an input form and searches through an array of objects for matches. These matches (if they exist) are displayed on one line of a result along with a 'button' to click to take action on that specific search result line.</p>
  
  <p>Each object in the array corresponds to a line of the result assuming that the search term if found in that object.</p>
  
  <p>I have created a delegated listener to listen for clicks on the button for each shown result line. How do I get the button to act on the the 'index: number' contained in the object that created that line of the results.</p>
  
  <p>My code so far is an follows:</p>
  
  <pre><code>var multiArr = [
  {label: "Asap Rocky", song: "National", index: 0},
  {label: "Rihanna", song: "Umbrella", index: 1},
  {label: "Coldplay", song: "Paradise", index: 2}];
  
  
  
  $('#results').on("click", ".result-button", function(event) {
      alert("You clicked:" + event.target.nodeName);
      console.dir($(this).text);
  });
  
  
  
  
  $("#finder").keyup(function(e){
          var q = $("#finder").val();
          console.log("Search Bar contents: " + q);
  
          var pattern = new RegExp( "^" + q, "i");
  
          $("#results").empty();
  
          for (var i = 0; i &lt; multiArr.length; i++){
  
              console.log("Checking for " + q + " in " + multiArr[i].label);
              console.log("The above is " + pattern.test(multiArr[i].label));
  
              if (pattern.test(multiArr[i].label)) {
                  console.log("something in here beings with " + q);
  
                  /*console.log("Img Url: " + thaArr);*/
                  //do something
                  $("#results").append("&lt;div class='result-line'&gt;&lt;div class='result-img'&gt;&lt;img src='http://img.youtube.com/vi/36wDeLKKoXE/default.jpg' class='center-result-img'&gt;&lt;/div&gt;&lt;div class='result-song-info'&gt;&lt;div class='result-song-title'&gt;&lt;p&gt;" + multiArr[i].song + "&lt;/p&gt;&lt;/div&gt;&lt;div class='result-song-artist'&gt;&lt;p&gt;" + multiArr[i].label + "&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class='result-button'&gt;&gt;&gt;&lt;/div&gt;&lt;/div&gt;");
              } 
  
          }
      });
  </code></pre>