jQuery: Table Striping

Let's get started with jQuery by "striping" a table. The plain table comes from a list of United States Senators.

• Plain table: senate-plain.html
• Striped table: senate-striped.html
  Include some Javascript libraries (jquery.js) and write a function that selects the table rows and applies a class. Note that the jQuery selectors are like CSS selectors (and here we see custom jQuery selectors of :even and :odd).

<script src="https://code.jquery.com/jquery-3.5.1.min.js"
      integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
      crossorigin="anonymous"></script>
<script>
   $(document).ready(function()
       {
           $("#senatetable tbody tr:even").addClass('evenRow');
           $("#senatetable tbody tr:odd").addClass('oddRow');
       }
   );
 </script>
     

Plain table:

Striped table: