title: Get selected drop-down value of a row in html table using JavaScript/jQuery
body: <p>I have a html table with 4 columns and multiple rows</p>
  
  <pre><code>column1 : simple text
  column2 : simple text
  column3 : select list with 2 values
  column4 : Button that performs some operation
  </code></pre>
  
  <p>At run time, I want to get the selected / entered values for all the columns of that row against which <code>column4</code> button is clicked.  I know a little of JavaScript/jQuery.</p>
  
  <p>Here is the static table code</p>
  
  <pre><code>&lt;table id="invoiceTbl" border="1"&gt;
  
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;Broker info&lt;/th&gt;
              &lt;th&gt;Receivable Amount&lt;/th&gt;
              &lt;&lt;th&gt;Status&lt;/th&gt;
                  &lt;th&gt;Action&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;&lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>And I am populating table i.e. inserting data on AJAX call like this:</p>
  
  <pre><code>$.ajax({
      type: "POST",
      data: $('#searchDetails').serialize(),
      async: false,
      cache: false,
      url: "/opsadmin/search.json",
      dataType: 'json',
      success: function (result) {
          var i = 1;
          $.each(result, function (index, value) {
              alert(index + ": " + value.brokerInfo);
              $('table#invoiceTbl TBODY').append('&lt;tr&gt; &lt;td&gt;' + i + '&lt;/td&gt;&lt;td&gt;' + value.brokerInfo + '&lt;/td&gt;&lt;td&gt;' + value.receivableAmount + '&lt;/td&gt;&lt;td&gt;&lt;select name="act" id="s"&gt;&lt;option&gt;PENDING&lt;/option&gt;&lt;option&gt;CLEARED&lt;/option&gt;&lt;/select&gt;&lt;/td&gt;&lt;td&gt;&lt;input type="button" value="Process" onclick="updateStatus(\'' + index + '\')"&lt;/input&gt;&lt;/td&gt;&lt;/tr&gt;');
              i++;
          });
      }
  });
  return false;
  </code></pre>