In my current project, which is built with Angular, I am looking for a way to achieve a specific effect without using jQuery. Specifically, I would like the text inside a div element with the class title to have underline styling when hovering over an img element. The challenge here is that these elements are not siblings or adjacent to each other. Is there a CSS or Angular solution that can make this possible?
<div class='big class'>
<div class='title'>
<p> This is a text that I want to be underlined when hovering over the img element </p>
</div>
<div>..........</div>
<div>..........</div>
<div>..........</div>
<img class='image' [src]="some image source"/>
</div>