JSFiddle - React, Tailwind, and code Playground

by Alex Chizhov

HTML

<table>
    <tr>
        <th>Budget</th>
        <th>Count</th>
        <th>Price</th>
    </tr>
    <tr>
        <td class="budget">
            <input type="text" value="11">
        </td>
        <td class="count">
            <input type="text" value="1">
        </td>
        <td class="price">16.99</td>
    </tr>
    <tr>
        <td class="budget">
            <input type="text" value="14">
        </td>
        <td class="count">
            <input type="text" value="1">
        </td>
        <td class="price">23.81</td>
    </tr>
    <tr>
        <td class="budget">
            <input type="text" value="14">
        </td>
        <td class="count">
            <input type="text" value="1">
        </td>
        <td class="price">17.97</td>
    </tr>
</table> <a href="javascript://" class="button">Вставить значения</a>

SCSS

table {
    width:100%;
    border: 1px solid #ccc;
    border-collapse: collapse;
    border-spacing: 0;
    tr{
       th,td {
            border: 1px solid #ccc;
            padding: 10px;
            width: 50%;
        }
    }
}

JavaScript

function round(number, decimals) {
    return parseFloat(number.toFixed(decimals));
}

$('.button').on('click', function (e) {
    e.preventDefault();

    $('table tr td.budget').each(function () {
        var budgetColumn = $(this).parent().find('td.budget');
        var countColumn = $(this).parent().find('td.count');
        var priceColumn = $(this).parent().find('td.price');

        var formula = priceColumn.text() - (priceColumn.text() * 0.15) - 2;
        formula = round(formula, 2);

        budgetColumn.find('input:text').val(formula);
    });

});