Trying to select a <ul> that follows a <h2> which must contain a <a href="with a-CodePudding

I'm working on a DocBook export to HTML and have little options to add "smart" classes to the HTML.

I'm left with a structure that looks like:

<h2><a href="the url I'm using to identify the UL set that follows">...</a></h2>
<ul>
...
</ul>

There are no classes on the <h2>, none on the <ul> either.

So my idea would be:

select the UL that comes after a H2 that contains an A with the HREF attribute to "my URL".

a combination of

h2 ~ ul

was what I first had in mind, but I can't figure out how to specify H2 with the "contains an A with the HREF attribute I want"...

CodePudding user response：

You can use has selector to check whether the h2 have anchor tag and then target the immediate next ul selector.

h2:has(a[href='www.test.com'])   ul {
  color:green;
}

<h2><a href="www.test.com">test</a></h2>
<ul>
Change to Green
</ul>
<h2><a href="www.testing.com">testing</a></h2>
<ul>
Not to Change Green
</ul>