JSFiddle - React, Tailwind, and code Playground

by jencinas69

HTML

<table>
    <tr><th>Select</th><th>Selected</th></tr>
    <tr><td>
<select id="data">
     <option selected="selected"></option>
    <option value="1">Fully Successfuly</option>
    <option value="2">Exceptional</option>
        <option value="3">Needs Improvement</option>
</select>
        </td>
        <td>
        </td>
        </tr><tr><td>
<select id="data2">
     <option selected="selected"></option>
    <option value="1">Fully Successfuly</option>
    <option value="2">Exceptional</option>
        <option value="3">Needs Improvement</option>
</select>
</td>
        <td>
    </td>
    </tr><tr>
        <td>
<select id="data3">
     <option selected="selected"></option>
    <option value="1">Fully Successfuly</option>
    <option value="2">Exceptional</option>
        <option value="3">Needs Improvement</option>
</select>
</td>
        <td>
    </td></tr><tr><td>
    <select id="data4">
         <option selected="selected"></option>
    <option value="1">Fully Successfuly</option>
    <option value="2">Exceptional</option>
        <option value="3">Needs Improvement</option>
</select>
</td>
        <td>
</td>
 </tr></table>

JavaScript

$("select").change(function(){
  ind = $('select').index(this);
  selVal = $(this).children("option").filter(":selected").val();
    $(this).parent().next('td').html(selVal);  
});