JSFiddle - React, Tailwind, and code Playground

by Spokey

HTML

<table border="1">
<tbody>
    <tr>
        <td width="334">S.No.</td>
        <td width="334">Product Name</td>
        <td width="334">Amount</td>
        <td width="334">Grams/Kg</td>
        <td width="334">Final Amount</td>
    </tr>
    <tr align="center">
        <td>1</td>
        <td>Product1</td>
        <td class="row1-amount">100</td>
        <td>
            <select id="1" class="sel">
                <option value=""></option>
                <option value="100">100g</option>
                <option value="250">250g</option>
                <option value="500">500g</option>
            </select>
        </td>
        <td id="row1"></td>
    </tr>
    <tr align="center">
        <td>2</td>
        <td>Product2</td>
        <td class="row2-amount">200</td>
        <td>
            <select id="2" class="sel">
                <option value=""></option>
                <option value="100">100g</option>
                <option value="250">250g</option>
                <option value="500">500g</option>
            </select>
        </td>
        <td id="row2"></td>
    </tr>
</tbody>

JavaScript

$(function(){
  $('select').change(function(){
        var td_id = 'row'+$(this).attr('id');
        var val = parseInt($(this).val());
        var amount = $('.'+td_id+'-amount').html();
        $('#'+td_id).html(val/1000*amount);
  });
});