clickable table tr row

by magizter

HTML

<table class="clickable">
        <thead class="thead-gray">
        <tr>
            <th scope="col">Group</th>
            <th scope="col">Account ID</th>
            <th scope="col" colspan="2">DisplayName</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td>Pablo Bentancor</td>
            <td>1210701</td>
            <td>Pablo BENTANCOR</td>
            <td class="text-center"><a href="aaaa.html"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i></a></td>
        </tr>
        <tr>
            <td>CHANG CHI - YIN</td>
            <td>1210703</td>
            <td>Chang CHI-YIN</td>
            <td class="text-center"><a href="aaaa.html"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i></a></td>
        </tr>
        <tr>
            <td>Martin Dyring-Andersen Holding ApS</td>
            <td>1210699</td>
            <td>Martin Dyring-Andersen Holding ApS</td>
            <td class="text-center"><a href="tradingreports.html"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i></a></td>
        </tr>
        <tr>
            <td>Natacha WAUQUIEZ</td>
            <td>1210713</td>
            <td>Natacha WAUQUIEZ</td>
            <td class="text-center"><a href="tradingreports.html"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i></a></td>
        </tr>
        </tbody></table>

CSS

.clickable tr:hover {
    cursor: pointer;
  }

JavaScript

$(document).ready(function() {

// Clickable row on the table
    $('tr').click(function() {
        var href = $(this).find("a").attr("href");
        if(href) {
            window.location = href;
        }
    });
    
    });