guys pls help to fix this. I need to add a random image refreshing when using iframe.try tried my best to find solution but it's not worked.pls help me to fix this.

here is my html

<iframe class="img-responsive center-block element-spacing-md" id="banner" width="970" height="250" frameborder="0" scrolling="no" allowfullscreen="true" style="width: 970px; height: 250px;" ></iframe>

here is the js

var imagee = new Array ();
    imagee[0] = "//s0.2mdn.net/dfp/370694/4408939339/1629903098931/index.html";
    imagee[1] = "//s0.2mdn.net/dfp/370694/4823240283/1652207585517/index.html";
    imagee2] = "//s0.2mdn.net/dfp/370694/4823240283/1652207585517/index.html";
    var size = imagee.length
    var x = Math.floor(size*Math.random())

    $('#banner').attr('src',imagee[x]);

$('#refresh').click(function() {
    location.reload();
});

codepen-https://codepen.io/mithun-deshan/pen/VwQozrQ