JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <h1 id="foo">h1#foo</h1>
    <div></div>
</div>
<section>
    <h1 id="bar">h1#foo</h1>
    <div></div>
</section>
<div>
    <div id="baz">div#baz</div>
    <h1 id="qux">h1#qux</h1>
</div>

CSS

h1 {
    background:black;
    color:white;
    height:1em;
    margin:0.5em 0;
}

div:first-of-type h1 {
    background:red;
}