JSFiddle - React, Tailwind, and code Playground

HTML

<div class="highlight">
    <p>Paragraph</p>
</div>
<div class="highlight">
    <img src="http://placekitten.com/200/200">
    <p>hello</p>
</div>
<div class="highlight">
    <div>
        Just a div
        <img src="http://placekitten.com/220/220">
    </div>
    <p>With a paragraph</p>
</div>

CSS

.highlight {
    margin: 10px;
    padding: 10px;
    border: 1px solid #eee;
}

.hlbackground {
    background-color: #E3EBC2;
}

.hlborder {
    border: 3px solid #E3EBC2;
}

JavaScript

$('.highlight > p:first-child').parent().hover(
    function() {
        $(this).addClass('hlbackground');
    }, function() {
        $(this).removeClass('hlbackground');
    }
);

$('.highlight > img:first-child').parent().hover(
    function() {
        $(this).addClass('hlborder');
    }, function() {
        $(this).removeClass('hlborder');
    }
);