How can I alter the URL that is buried quite deep in div's and alter it's URL only when a class is present of a parent>parent>parent div.

Context: I'm trying to alter the logo image in a sticky header that alters its background colour when scrolled. When the altered state is active, one of the parent divs has a class called ".bt-active" added.

Something like this, the normal state code is:

```
<section class="bdt-sticky">
<div data-id="208ba95" class=" element  element-208ba95  logo  widget  widget-image" id=" logo" data-element_type="image.default">
    <div class=" widget-container">
        <div class=" image">
            <a href="https://site.uk/" data- open-lightbox=""><img src="logo-1.png" class="attachment-full size-full" alt="" width="180" height="26"></a>
        </div>
    </div>
</div>

```

and the code when the sticky is active is:

```
<section class="bdt-sticky bdt-active">
<div data-id="208ba95" class=" element  element-208ba95  logo  widget  widget-image" id=" logo" data-element_type="image.default">
    <div class=" widget-container">
        <div class=" image">
            <a href="https://site.uk/" data- open-lightbox=""><img src="logo-1.png" class="attachment-full size-full" alt="" width="180" height="26"></a>
        </div>
    </div>
</div>

```

I want to alter the logo in the active state to be src="logo-2.png"