title: Button in a list, how to make it ''edit'' the good line?
body: <p>I'm trying to make list rows editable with a click button. The "edit" button should edit the line it matches with. Right now, the edit button only edit the first row.</p>
  
  <p>It's for a little program I'm developping on node.js. HTML, CSS and Javascript is what I'm mostly using.</p>
  
  <p><strong>Here's my HTML body:</strong> </p>
  
  <pre><code>&lt;tr ng-repeat="offer in offers|limitTo:5"&gt;
  
     &lt;td&gt;&lt;button onclick="editOfferInfos()"&gt;Edit&lt;/button&gt;&lt;/td&gt;
  
     &lt;td id="offerNamePostfix" class="offerNamePostfix"&gt;{{offer.namePostfix}}&lt;/td&gt;
     &lt;td id="offerUrl" class="offerUrl"&gt;{{offer.url}}&lt;/td&gt;
     &lt;td id="offerLimitEnabled"&gt;{{offer.capConfiguration.enabled}}&lt;/td&gt;
     &lt;td id="offerLimit"&gt;{{offer.capConfiguration.limit}}&lt;/td&gt;
     &lt;td id="offerTimeUnit"&gt;{{offer.capConfiguration.timeUnit}}&lt;/td&gt;
     &lt;td id="offerReplacementOfferId"&gt;{{offer.capConfiguration.replacementOfferId.id}}&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p><strong>Javascript Function:</strong> </p>
  
  <pre><code>function editOfferInfos(){
    var x = document.getElementById("offerNamePostfix");
      x.innerHTML = "&lt;input type='text'&gt;";
  
    x = document.getElementById("offerUrl");
      x.innerHTML = "&lt;input type='text' placeholder={offer.url}}&gt;";
    x = document.getElementById("offerLimitEnabled");
  
      x.innerHTML = "&lt;input type='text' placeholder={{offer.capConfiguration.enabled}}&gt;";
  
    x = document.getElementById("offerLimit");
      x.innerHTML = "&lt;input type='text' placeholder={{offer.capConfiguration.limit}}&gt;";
  
    x = document.getElementById("offerTimeUnit");
      x.innerHTML = "&lt;input type='text' placeholder={{offer.capConfiguration.timeUnit}}&gt;";
  
    x = document.getElementById("offerReplacementOfferId");
      x.innerHTML = "&lt;input type='text' placeholder={{offer.capConfiguration.replacementOfferId.id}}";
  }
  </code></pre>
  
  <p>The button ''Edit Button'' should turn the matching line with textboxes. Right now, it is turning into textboxes only the first row, be it the first button, or the last one.</p>