title: jQuery to hide a DIV if it has no unordered list items
body: <p>I am having trouble coming up with a jQuery script that will all content of a div if there are no unordered list items present. So if there are unordered list items inside of the div then the div will be displayed, otherwise it will be hidden.</p>
  
  <p>here is the basic html I have to test this:</p>
  
  <pre><code>&lt;html&gt;
  &lt;title&gt;Experiment Fix Div Hidding&lt;/title
  &lt;head&gt;
  
  &lt;link rel="stylesheet" type="text/css" href="css/css.css" media="all"/&gt;
  &lt;script src="js/jquery-1.7.1.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/scripts.js"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  
  &lt;table&gt;
  
  &lt;tr&gt;
  &lt;td&gt;
  &lt;div id="contenFirst"&gt;Sample Content. Not display if not bullets points exists
  &lt;ul&gt;
  &lt;li&gt;&lt;a href="#"&gt;Hello world&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;Hello world2&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;
  &lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;/table&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Here is the script I have come up with so far, but it doesn't seem to do the job:</p>
  
  <pre><code>$(document).ready(function(){
  
  // hiding a div based on it not having any content (unordered list items)
  if($("#contentFirst").html().length == 0){
  $("#contentFirst").hide();
  } 
  });
  </code></pre>
  
  <p>I am going in the right way with the jquery script, haven't done much with jquery before. </p>
  
  <p>Any suggestions will be greatly appreciated.</p>