[FIXED] How to iterate through a table rows and get the cell values using jQuery

Issue

I am creating the below table dynamically using jQuery... After executing my code I get the table as below:

<table id="TableView" width="800" style="margin-left: 60px">
<tbody>
 <tr>
 <th>Module</th>
 <th>Message</th>
</tr>
<tr class="item">
 <td> car</td>
 <td>
  <input class="name" type="text">
 </td>
 <td>
<input class="id" type="hidden" value="5">
</td>
   </tr>
<tr class="item">
 <td> bus</td>
 <td>
  <input class="name" type="text">
 </td>
 <td>
<input class="id" type="hidden" value="9">
</td>
  </tr>

I used to iterate the table like this:

 $("tr.item").each(function() {
            var quantity1 = $this.find("input.name").val();
        var quantity2 = $this.find("input.id").val();

            });

By using the above query I am getting values of first row cells only... help me with jQuery that will iterate through the whole rows of the table and get the row cell values in quantity1 and quantity2.

Solution

$(this) instead of $this

$("tr.item").each(function() {
        var quantity1 = $(this).find("input.name").val(),
            quantity2 = $(this).find("input.id").val();
});

Proof_1

Proof_2

Answered By - thecodeparadox

Answer Checked By - Clifford M. (PHPFixing Volunteer)