title: Hover div jquery
body: <p>Here is my script :</p>
  
  <pre><code>  &lt;body&gt;
      &lt;div id ="mainCategory" class='fade'&gt;
          Category&lt;/div&gt;
      &lt;div id="divSubCategory"&gt;
          Category1
          &lt;br /&gt;
          Category2
      &lt;/div&gt;
      &lt;script type="text/javascript"&gt;
          $("div").hover(
              function () {
                  $(this).append($("#divSubCategory").html());
              },
              function () {
                  $("#divSubCategory").remove();
              }
           );
          $("#divSubCategory.fade").hover(function () { $(this).fadeOut(100); $(this).fadeIn(500); });
  
      &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>I want to show and hide divSubCategory on mainCategory hover. But it doesn't work. What should I add?</p>