jsでiframe内の画像のサイズを変える

iframe内のスタイルってこんな感じのCSSの書き方だと効かない

iframe #ifr img{
   width: 700px;
}

＜ifreme allowfullscreen="" src="https://sample.com/index.html" id="ifr" scrolling="no"＞＜/ifreme＞

このsample.com/index.html内にあるimgファイルのサイズを変えたい時

$(function () {
  $("#ifr").on("load", function () {
    $("#ifr").contents().find("img").css("width", "700px");
  });
});