I am working on a WordPress website and want to embed an iframe from an external reservation/booking tool.

My issue: I can't make the height of the iframe dynamic. A fixed height of the iframe won't be a good solution in this case.

URL I want to embed https://w1.roomsoftware.com/de/markus-raab

Elementor Custom HTML widget:

<iframe src="https://w1.roomsoftware.com/de/markus-raab" id="booking"></iframe>

<script>
// Selecting the iframe element
var iframe = document.getElementById("booking");

// Adjusting the iframe height onload event
iframe.onload = function(){
    iframe.style.height = iframe.contentWindow.document.body.scrollHeight + 'px';
}

Any idea what could be the reason that this does not work?

Screenshot shows the scrollbar of the embedded iframe