I have added an iframe to my website. Within the I-Frame is an area which is not required and I would like to hide.

I have tried to inject CSS into the i-frame using

Functions.php

add_action( 'wp_enqueue_scripts', 'Eazy_scripts' );
function Eazy_scripts() {
    wp_register_script('js-iframe', get_stylesheet_directory_uri() . '/js/iframe.js', array('jquery'),'1.1', true);
    wp_enqueue_script('js-iframe');
}

The script iframe.js

( function( $ ) {
    $("#EazyOpsFrame").on("load", function() {
    let head = $("#EazyOpsFrame").contents().find("head");
    let css = '<style>div.fixed.area{display:none !important}</style>';
    $(head).append(css);
  });
} )( jQuery );

This doesnt seem to work, are there any recommendations?

I have added an iframe to my website. Within the I-Frame is an area which is not required and I would like to hide.

I have tried to inject CSS into the i-frame using

Functions.php

add_action( 'wp_enqueue_scripts', 'Eazy_scripts' );
function Eazy_scripts() {
    wp_register_script('js-iframe', get_stylesheet_directory_uri() . '/js/iframe.js', array('jquery'),'1.1', true);
    wp_enqueue_script('js-iframe');
}

The script iframe.js

jQuery(document).ready(function(){
  jQuery("#EazyOpsFrame").on("load", function() {
      let head = $("#EazyOpsFrame").contents().find("head");
      let css = '<style>div.fixed.area{display:none !important}</style>';
  jQuery(head).append(css);
  });
});

This doesnt seem to work, are there any recommendations?