I have a webpage with an iframe element which points to an external form (from a third-party website):

<p><iframe id="ifmSearch" style="width: 100%; min-height: 800px;" title="Form" src="https://thirdpartysite.com"></iframe></p>

I have written the following code to read the third-party form embedded in the iframe:

$('#ifmSearch').on('load', function() {

    document.getElementById('myForm').addEventListener('submit', function(event) {
        event.preventDefault();
        console.log(document.getElementById('notice').value);
        var form = new FormData();
        form.append("email", document.getElementById('myEmail').value);

        var settings = {
            "url": "http://localhost/send-mail.php",
            "method": "POST",
            "timeout": 0,
            "processData": false,
            "mimeType": "multipart/form-data",
            "contentType": false,
            "data": form
        };

        $.ajax(settings).done(function(response) {
            console.log(response);
        }).catch(error => console.log('error', error));
    });

    console.log('loaded');
});

But... the form with id myForm is not present after the iframe loading.

Thanks in advance for your help. Any comment or answer will be helpful for me.