How to make my png disappear onCollision with another png?

Im making a game, where I'm moving the head of a windmill up and down the Y-axis with the ArrowUp and the ArrowDown keys.

I have wind going from left side of the screen to the right, on the x-axis only (using @keyframes).

I need the wind to disappear when/if it hits the windmill-head, preferably using an if() statement.

Both the wind and the windmill-head are png's with different divs and ids.

I am currently writing in html & js, styling it in css.

this is my current, non-functional if() statement:

        {
        var vindforsvind = document.getElementsById("div1");
        var vindmøllehoved = document.getElementById("car");
        if(vindforsvind.x && vindforsvind.y == vindmøllehoved.x && vindmøllehoved.y)
        {
        vindforsvind.style.display = "none";
        }
        }```

Thank you!