Updating link under "Details" button in availability widget

Hi folks!  I'm trying to update the href of the details button on the availability widget.  I want to send it to a specific page when results come back and not to the page that is configured under the property URL.  This is what I have so far

Hi, is there a way using javascript to update the link on the details button located in the availability widget? I have this so far:

const url = 'https://';
const iframe = document.querySelector('iframe[src^="${url}"]');

iframe.addEventListener('load', function() {
const link = document.getElementsByClassName('btn btn-default');
var txtQS = window.location.search;
var newURL='https://glencairnknoll.com/book-glencairn-knoll/' + txtQS;
link.setAttribute('href', newURL);
});

I'm getting this error in chrome: Uncaught TypeError: Failed to execute 'observe' on 'MutationObserver': parameter 1 is not of type 'Node'.

Hi Deb, thank you for writing in. Unfortunately, I don't believe you will be able to edit content within the widget iframe using JavaScript due to cross-origin restrictions. If you'd like to make a feature request for a separate property search URL from the public URL, you can do so by adding a post to our feature request forum.

Regarding the script here, I did not run into that error, but did have issues with a couple of other items. The first was that to use the url parameter in querySelector, backticks must be used instead of single quotes.
const iframe = document.querySelector(`iframe[src^="${url}"]`);

The other issue is that to access the button in the iframe, it needs to be fetched from the iframe document. This would look something like the following:

const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
if (iframeDoc) {
    const link = iframeDoc.querySelector('.btn.btn-default');

    <your code>