Help! Custom Email Validation - Using Wordpress and Elementor🤺🤺🤺

Hello!

Im looking to validate business emails by filtering common email ids such as @yahoo.com @gmail.com etc.. Im looking to do this with JS as shown in the image.

Been breaking my head over this for over 2 months because there are no plugins that support this functionality(dynamicoo, contact 7 etc)

I have tried with contact 7, but it still doesnt filter outlook and yahoo. Here is the code i have used:

function blocked_email_domain($email) {
$blocked = array("@gmail.com", "@hotmail.com", "@yahoo.com", "@yahoo.in","@msn.com", "@live.com", "@outlook.com", "@microsoft.com", "@zoho.com", "@rediff.com");
$email = strstr($email, '@');
if(in_array($email, $blocked))
return false;
else
return true;
}

function custom_email_validation_filter($result, $tag) {
$type = $tag['type'];
$name = $tag['name'];
if($name == 'your-email') { // Only apply to fields with the form field name of "your-email"
$the_value = $_POST[$name];
if(!blocked_email_domain($the_value)){
$result['valid'] = false;
$result->invalidate( $tag, 'You need to provide an email address that isn\'t hosted by a free provider.<br />Please contact us directly if this isn\'t possible.');

};
};
return $result;
}
add_filter('wpcf7_validate_email','custom_email_validation_filter', 10, 2); // Email field
add_filter('wpcf7_validate_email*', 'custom_email_validation_filter', 10, 2); // Required Email field

Now as a last solution im trying to insert JQuery into elementor! Need help!

TIA