JSFiddle - React, Tailwind, and code Playground

HTML

<div id="jobs">
    <table>
        <tbody>
            <tr id="test1">
                <td>TEST1</td>
                <td><button data-job="test1">&gt;</button></td>
            </tr>
            <tr id="test2">
                <td>TEST2</td>
                <td><button data-job="test2">&gt;</button></td>
            </tr>
        </tbody>
    </table>
</div>

CSS

button:hover
{
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
    color:red;
}

JavaScript

$("button").click(function () {
            var animationDuration = 500;
            var job = $(this).data("job");
            var selectedRow = document.getElementById(job);
            $("#jobs").find("tr").not(selectedRow).fadeTo(animationDuration, .3);
            $(selectedRow).fadeTo(animationDuration, 1);
            });