title: JS: can't open links other than first
body: <p>I'm Looping through rows, generating links with each their identical value, in this case. </p>
  
  <p>Shown here:</p>
  
  <pre><code>@foreach (var article in Model.Articles)
     {
        &lt;tr class="etc"&gt;
            @if (Model.Order.Status == Model.Orders.Status.Blocked)
                          {
                              &lt;td id="buttonDeleteOrderLine" description="@article.Description" name="@Model.Order.FullName" value="@article.LineId" &gt;&lt;a href="#"&gt;Delete Line&lt;/a&gt;&lt;/td&gt;
                          }
  </code></pre>
  
  <p><strong>Value="<em>value</em>" is unique in this case!</strong></p>
  
  <p>My JS:</p>
  
  <pre><code>    $('#buttonDeleteOrderLine').on('click', function () {
      var DOL = $(this);
      var orderDescription = DOL.attr("description");
      var customerName = DOL.attr("name");
      var lineID = DOL.attr("value");
  </code></pre>
  
  <p>I'm getting links for each row, and they're also clickable. However, only the first one actually works (shows a modal, not included in JS Code)</p>
  
  <p><a href="https://i.stack.imgur.com/joXAi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/joXAi.png" alt="Not nessecairy"></a></p>
  
  <p>So I need a way, to search the class 'buttonDeleteOrderLine' (because the ID changes), and yet get the info from the clicked link. </p>