title: jQuery outerHeight() returns 0 even with jQuery(window).load()
body: <p>After i loaded content with ajax i wanna get the outerHeight of the loaded elements.</p>
  
  <p>Ajaxload file:</p>
  
  <pre><code>$('#workshop').submit(function(event){
  
  
  
          $.ajax({
          url: URL,
          type: 'POST',
          data: $('#workshop').serialize(),
          success: function(data){
  
              var string = '&lt;div class="section" id="result"&gt;&lt;/div&gt;';
  
              if(prevent == true){
                   $('#container #result').html($("#main .inside&gt;.mod_article", data));
  
                   $.getScript( scriptURL, function() {
                          });
              }else{
                  $('#container').append(string);
                  $('#container #result').html($("#main .inside&gt;.mod_article", data));
  
  
                      $.getScript( scriptURL, function() {
                          });
  
  
                  prevent = true;
  
              }
  
      });
          event.preventDefault();
  });
  </code></pre>
  
  <p>The script loaded looks like :</p>
  
  <pre><code>var height;
  var top ;
  
  function scroll_down(){
  
  jQuery(window).load(function(){
      $('.result_control .up').css({'display' : 'block'});
  
      top = $('.item_wrapper&gt;.inner').css('top');
       height =  $('.item_wrapper&gt;.inner&gt;.item').outerHeight(true);
  
  });
  
  console.log(top);
  console.log(height);
  
  }
  
  
  function scroll_up(){
  console.log('up');
  }
  
  $('.item_wrapper').mousewheel(function(event, delta, deltaX, deltaY){
  if(delta &gt; 0){
      scroll_up();
  }else if(delta &lt; 0){
      scroll_down();
  }
   });
  </code></pre>
  
  <p>The HTML of the loaded elements :</p>
  
  <pre><code>&lt;div class="item_wrapper"&gt;
    &lt;div class="inner"&gt;
      &lt;div class="item"&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The css code of these elements : </p>
  
  <pre><code>.section#result .workshopfilter .filterresult .item_wrapper {
  overflow: hidden;
  width: 100%;
  height: 65%;
  position: relative;
  clear: both !important;
  }
  .section#result .workshopfilter .filterresult .inner {
  position: absolute;
  top: 0px;
  width: 100%;
  clear: both !important;
   }
  .section#result .workshopfilter .filterresult div.item {
  float: left;
  margin-right: 1%;
  margin-left: 1%;
  margin-bottom: 2%; 
  width: 27%;
  background-color: #ffff00;
  color: #333;
  height: 250px;
  padding: 2%;
  position: relative;
  display: block;
  font-family:'AmericanTypwrterITCW01- 731031';
  }
  </code></pre>
  
  <p>.css() returns  object</p>
  
  <p>.outerHeight returns 0</p>
  
  <p>The elements are visible and displayed:block.
  I dont know how to fix it to get the right properties.</p>