php-動的に作成された特定のテーブル行のhtmlとテキストをajax応答から変更します

データベースから、次のような動的テーブルがあります：

 <table>
    <?php
    $query = ....;
    foreach ($query as $row) {
        echo '<tr>';
        echo '<td>' . ' <span class="bName">' . $row['brand_name'] . '</span>'.
        '<input name="product_id" type="number" value="' . $row['product_id'] . '">'.
        '<input name="company_id[]" type="number" value="' . $row['company_id'] . '">'.
        '<button name="exchange" type="button">Click Me!</button></td>';
        echo '</td>';
        echo '</tr>';
    }
    ?>
</table>
 
 <span>とproduct_idbrand_nameを含む4行を返します> <input>内。クリックのexchangeボタンは、別のランダムなbrand_nameをクエリするajaxリクエストを呼び出し、クエリを JSONのように返します。これ：
 {product_id： '2206'、brand_name：'新しい名前'、company_id： '234'}
 
ajaxのスクリプトは