title: JQuery to set the height of a div on page load
body: <p>OK so I have a container div that loads some content which is generated by php. I don't know what the height of the content is and it is absolute positioned so the container div doesn't know how high to be until all the content is there. I collect the the height it needs to be in a php variable and want to use jquery to set the container div to this height but it's not working yet.</p>
  
  <p>I have put this code near the bottom of the page:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function () {
  $("#DynContainer").css({height:&lt;?php echo $containerHeight; ?&gt;px})
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>It is currently not working but looking at the code the php variable is echoed into it correctly. E.g:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function () {
  $("#DynContainer").css({height:440px})
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>EDIT:</p>
  
  <p>As many have helpfully suggested I needed to provide valid code for the CSS. I have since changed it to generate this code:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function () {
  var containerHeight = "440px";
  $("#DynContainer").css({height: containerHeight})
  });
  </code></pre>
  
  <p></p>
  
  <p>However it still doesn't work. The ID reference is deffo correct.</p>
  
  <p>EDIT2:</p>
  
  <p>Looking at the console I get this error:</p>
  
  <pre><code>[15:46:29.460] TypeError: $ is not a function @ http://localhost/serge/?page_id=2045:242
  </code></pre>
  
  <p>Suggesting jQuery is not loaded, but it's definitely called at the top of the page. Here is the whole page code: <a href="http://pastebin.com/tGadjaRA" rel="nofollow">http://pastebin.com/tGadjaRA</a></p>
  
  <p>SOLVED: it was a noconflict jQuery issue.
  Thanks everyone</p>