JSFiddle - React, Tailwind, and code Playground

HTML

<p class="foo-bar-1">TEST 1</p>
<p class="foo-bar-2">TEST 2</p>
<p class="foo-bar-3">TEST 3</p>
<p class="foo-bar-4">TEST 4</p>
<p class="foo-bar-5">TEST 5</p>
<p class="foo-bar-6">TEST 6</p>
<p class="foo-bar-7">TEST 7</p>
<p class="foo-bar-8">TEST 8</p>
<p class="foo-bar-9">TEST 9</p>
<p class="foo-bar-10">TEST 10</p>
<p class="foo-bar-11">TEST 11</p>
<p class="foo-bar-12">TEST 12</p>
<p class="foo-bar-13">TEST 13</p>
<p class="foo-bar-14">TEST 14</p>
<p class="foo-bar-15">TEST 15</p>
<p class="foo-bar-16">TEST 16</p>
<p class="foo-bar-17">TEST 17</p>
<p class="foo-bar-18">TEST 18</p>
<p class="foo-bar-19">TEST 19</p>
<p class="foo-bar-20">TEST 20</p>

CSS

.foo-bar-10 ~ p {
    background: red;
}