html-heading

I'm having trouble understanding the proper usage of HTML headings. I'm using books and online resources to self-learn but there are slight discrepancies on how to use them. [1] "Note that the h1 tag is only used once, as the main heading of the page. h2 to h6 , however, can be used as often as desired, but they should always be used in order, as they were intended. For example, an h4 should be a sub-heading of an h3 , which should be a sub-heading of an h2 ." OR [2] "the logical heading level reflects its importance in relation to the main content." So the question is: do I use them in order

I read related posts, but didn't find a solution for IE, so I ask for a jQuery-solution for this problem: I've some nested hierarchical Headings like this <h1> heading 1</h1> <h2> subheading 1</h2> <h1> heading 2</h1> <h2> subheading 1</h2> <h2> subheading 2</h2> I need some automated headings output like this: 1. heading 1 1.2 subheading 1 2. heading 2 2.1. subheading 1 2.2. subheading 2 Is there a way how this can be achieved using jQuery or alike, working in IE6+? another possibility var indices = []; function addIndex() { // jQuery will give all the HNs in document order jQuery('h1,h2,h3