title: I want to display div when hover on anchor tag by JQUERY
body: <p>This my code but nothing happens with it. When I hover over the anchor tag I want to display a <code>div</code> like a popup window.    </p>
  
  <pre><code>&lt;!-- begin snippet: js hide: false --&gt;
  
  &lt;!-- language: lang-html --&gt;
  
  &lt;head runat="server"&gt;
      &lt;title&gt;&lt;/title&gt;
      &lt;script src="script/jquery-1.11.1.min.js"&gt;&lt;/script&gt;
      &lt;script&gt;
          $(".hoverdetails").on({
              mouseover: function() {
                  $(".romdetails").stop().show(1000);
              },
  
              mouseout: function() {
                  $(".romdetails").stop().hide(1000);
              }
          })
      &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;form id="form1" runat="server"&gt;
  &lt;asp:DataList ID="dtlRoomCart" CssClass="romcrt" HorizontalAlign="center" runat="server" ShowHeader="False"
                                                                              Width="720px" OnItemDataBound="dtlRoomCart_ItemDataBound"&gt;
                                                                              &lt;ItemTemplate&gt;
          &lt;a href="#" class="hoverdetails"&gt;RoomDetails&lt;/a&gt;
      &lt;div class="romdetails" style="background-color:blue;width:300PX;height:300PX;display:none"&gt;
      &lt;/div&gt;
                                                                                &lt;/ItemTemplate&gt;
      &lt;/asp:DataList&gt;
  &lt;/form&gt;
  </code></pre>