title: jQuery set height of a div to the 'dynamic height' of another
body: <p>I have two divs.</p>
  
  <pre><code>  &lt;div class="col-1"&gt;&lt;p&gt;Content&lt;/p&gt;&lt;/div&gt;
    &lt;div class="col-2"&gt;&lt;img src="" alt="" /&gt;&lt;/div&gt;
  </code></pre>
  
  <p>With their respected content inside each one.</p>
  
  <p>I am trying to set the height of col-2 to be exactly as that of col-1. </p>
  
  <p>I tried this using jQuery:</p>
  
  <pre><code>   $(document).ready(function() {
          var divHeight = $('.col1').height(); 
          $('.col2').css('min-height', divHeight+'px');
      });
  </code></pre>
  
  <p>The problem is that col-1 does not have a height set on it. It has a dynamic height which grows when its content grows. Therefore the above code does not work for it.</p>
  
  <p>Is there any way I can set the min height of col-2 to be equal to the dynamic height of col 1 using jQuery?</p>