HTML JQuery Get Element Width Inside of iFrame?

Question

Have this iframe on page:

<iframe name="fileFrame" id="fileFrame" class="fileFrame" style="display:none;" src="http://example.com" height="50%" width="50%"></iframe>

The iframe has an element inside of it pulled from other website:

<div class="progress-bar" style="display:block; width: 18%;"></div>

How can I get the main page to pull the progress bars width?

Trying to track this to get main page to update when the progress bar is finished loading (100%) in the iframe.

Tried this and didn't work:

var mydivw = $("#fileFrame").contents().find(".progress-bar").width();
alert(mydivw);

Answer 1

Try like this

$("#fileFrame").contents().find(".progress-bar").width()

You can put it on load

Like this

$("#fileFrame").on("load",function(){

  var width=$(this).contents().find(".progress-bar").width()

})