Auto-number table rows?

Answer 1

The following CSS enumerates table rows (demo):

table {
  counter-reset: rowNumber;
}

table tr::before {
  display: table-cell;
  counter-increment: rowNumber;
  content: counter(rowNumber) ".";
  padding-right: 0.3em;
  text-align: right;
}

  
blue
  
red
  
yellow
  
green
  
purple
  
orange
  
maroon
  
mauve
  
lavender
  
pink
  
brown

If the CSS cannot be used, try the following JavaScript code (demo):

var table = document.getElementsByTagName('table')[0],
  rows = table.getElementsByTagName('tr'),
  text = 'textContent' in document ? 'textContent' : 'innerText';

for (var i = 0, len = rows.length; i < len; i++) {
  rows[i].children[0][text] = i + ': ' + rows[i].children[0][text];
}

  

    
blue
  
  

    
red
  
  

    
black