50/50 chance of getting element size with jQuery
===

I have weird problem which i find very difficult to reproduce on jsfiddle. Best i could do was this : http://jsfiddle.net/SUst2/ but this works every time printing out correct width and height every time.

Same time it works only like 50% of times. Other times it gets 0 as image size and width.

My HTML is:

    <div role="main" id="main">
    <div class="row">
    	<div class="twelve columns" style="float:none;">
    			<img src="/media/files/clientfiles/test1_X-1a_.png" id="editorImage">
    	</div>
    	<div class="four columns">zalalal</div>
    </div>
    </div>


matching css is:

    #main {
    width: 1000px;
    margin: 50px auto;
    background: white;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.23);
    -webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.23);
    box-shadow: 0px 0px 5px rgba(0,0,0,0.23);
    color: #666;}
    
    .row {
    width: 1000px;
    max-width: 100%;
    min-width: 768px;
    margin: 0 auto;
    }
    
    .row .twelve {
    width: 75%;
    }
    
    .column, .columns {
    float: left;
    min-height: 1px;
    padding: 0 10px;
    position: relative;
    }

and javascript is 

    jQuery(function($){
    		var element = $('#editorImage');
    		console.log(element);
    		console.log(element.width());
    		console.log(element.height());
    		console.log(element.outerWidth());
    		console.log(element.outerHeight());
    		console.log(element.offsetWidth);
    		console.log(element.offsetHeight);
    });

at first i thought its related to trying to get element size before document ready, but jQuery(function($... should take care of that, no?

Alan