Advertisement
-Annie-

04.ColorizeTable

Jun 24th, 2017
71
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Demo</title>
  6. </head>
  7. <body>
  8.     <table>
  9.         <tr><th>Name</th><th>Town</th></tr>
  10.         <tr><td>Eve</td><td>Sofia</td></tr>
  11.         <tr><td>Nick</td><td>Varna</td></tr>
  12.         <tr><td>Didi</td><td>Ruse</td></tr>
  13.         <tr><td>Tedy</td><td>Varna</td></tr>
  14.     </table>
  15.     <button onclick="colorize()">Colorize</button>
  16.     <script>
  17.         function colorize() {
  18.             let oddTableCells = document.querySelectorAll('tr:nth-child(even)');
  19.             for(let i = 0; i < oddTableCells.length; i++) {
  20.                 oddTableCells[i].style.backgroundColor = 'teal';
  21.             }
  22.         }
  23.     </script>
  24. </body>
  25. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement