[HTML] Highlight row when click on table using jquery

description
        - Create table grid with active color (highlight) when clicked a row using javascript (jquery).

howto
1. download jquery.
2. create index.html , css folder(inside the folder create style.css)
    and js folder (inside the folder put jquery file).
3. here's the code :
     - declare js and css.
        <script type="text/javascript" src="js/jquery-1.10.2.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.10.4.custom.min.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.10.4.custom.js"></script>
        <link rel="stylesheet" type="text/css" href="css/jquery-ui-1.10.4.custom.css">
        <link rel="stylesheet" type="text/css" href="css/style.css">
 
     - create simple table grid :
       * for row table , give id for example #rowtable
       <table>
            <tr>
                 <th>row 1 , cell 1 , this is header 1</td>
                 <th>row 1 , cell 2 , this is header 2</td>
            </tr>
            <tr id="rowtable">
                 <td>row 2 , cell 1 , this is values 1</td>
                 <td>row 2 , cell 1 , this is values 2</td>
            </tr>
            <tr id="rowtable">
                 <td>row 3 , cell 1 , this is values 1</td>
                 <td>row 3,  cell 1 , this is values 2</td>
            </tr>
       </table>

      - add css code to your style.css
        tr{ /* make sure change cursor when over row , it looks like profesional LOL */
            cursor: pointer;
            cursor: hand;
        }

        #rowtable:hover{
            background:orange !important;
        }

        #rowtable.clicked{ /*it means id='rowtable' class='clicked'*/
            background:orange;
        }

      - now add javascript code using jquery
        $("document").ready(function(){
             $('tr').click(function() {
                      $(this).removeClass("clicked")
                      $(this).addClass("clicked").siblings().removeClass("clicked");
             });
        });

4. DONE , now you can highlight the row when click , and it's automatic remove highlight
    when change to another row :)