Iterate a table rows with JQuery

 HTML table can be easily iterated using jQuery as shown below. The trick is to use a class for each row and iterate using $("tr.item") selector. 
Also note that $this.find is used to get value of a given table cell.


HTML
  <table>
 <tr class="item">

    <td> cell1 </td>
    <td> <span class="value">25.00 </span> € </td>
    <td> <input type="text" value="15" class="quantity" /> </td>
   </tr>
   <tr class="item">
    <td> cell2 </td>
    <td> <span class="value">50.00 </span> € </td>
    <td> <input type="text" value="16" class="quantity" /> </td>
   </tr>
</table>

JavaScript
$("tr.item").each(function() {

  $this = $(this);

  //gets value of span 
  var value = $this.find("span.value").html();

  //gets value of input 
  var quantity = $this.find("input.quantity").val();
});

Retrieve button value

You can use jQuery val() function to retrieve buttons' value as shown below.

HTML

<button class="btn1"  name="btn1" value="button1">
    Label</button>

JavaScript

<script type="text/javascript">
    $(function() {
        $('.btn1').click(function() {
            alert($(this).val());
        });
    });
</script>

 This will display the value button1.

Regards,
Samitha