title: css selectors : finding the last sibling of a type
body: <p>I have a document that looks like this :</p>
  
  <pre><code>&lt;h1&gt;Title A&lt;/h1&gt;
  &lt;h2&gt;Sub 1&lt;/h2&gt;
  &lt;h1 class='foo'&gt;Title B&lt;/h1&gt;
  &lt;h2&gt;Sub 2&lt;/h2&gt;
  &lt;h2&gt;Sub 3&lt;/h2&gt;
  &lt;h1&gt;C&lt;/h1&gt;
  &lt;h2&gt;Sub 4&lt;/h2&gt;
  </code></pre>
  
  <p>And I'd like to select Sub 2 and 3, because they are after Title B, a h1 with class foo. However, Sub 4 doen't interest me be cause the previous h1 is of class foo.</p>
  
  <p>I know I could put div around each block beginning with h1, but my content is generated via markdown, so the only way is to change the DOM once the page is loaded, and it feels dirty and cumbersome.</p>
  
  <p>My question is kinda related to this one <a href="https://stackoverflow.com/questions/17106089/how-to-select-all-elements-after-specific-element-in-css">How to select all elements after specific element in CSS</a> but I lack the "back to normal" behavior once a regular h1 is seen.</p>