Compare TD values
Dropdown will change according to td value
HTML
<table>
<tr>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>
<select class="field">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</td>
<td>
<select class="field">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</td>
<td>
<select class="field">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</td>
</tr>
</table>
CSS
table {
font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
}
td,
th {
border: 1px solid #dddddd;
text-align: left;
padding: 8px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
JavaScript
$(".field").change(function() {
var firstDropVal = $(this).val();
//alert(firstDropVal);
var column_num = parseInt( $(this).index() ) + 1;
var column = $("table td").eq(column_num);
var columnValue = column[0].innerText;
alert("Selected Value = " + firstDropVal + " and Column Value = " + columnValue)
});