title: jquery offset method doesn't always work / exist
body: <p>Good morning and happy new year everyone!</p>
  
  <p>I've run into a snag on something and need to figure out a solution or an alternative, and I don't know how to approach this. I actually hope it's something easy; meaning one of you all have dealt with this already.</p>
  
  <p>The problem is that I'm doing rollovers that contain information. They're divs that get moved to the absolute location. Now I've tried this with jquery 1.6 - 1.9.1. Of course this has to work in multiple browsers. </p>
  
  <p>What needs to happen is on rollover show a div, and when you rollout of that div, make it hide.</p>
  
  <pre><code>...
  // .columnItem is class level and works
  $(".columnItem").mouseleave(function() {
      $(this).css("display", "none");
  });
  ...
  
  $(".column").mouseenter(function() {
      var currentItem = $(this)[0]; // this is where the problem is
  
      // hide all .columnItems
      $(".columnItem").css("display", "none");
  
      // i get this error: Object #&lt;HTMLDivElement&gt; has no method 'offset' (viewing in chrome console)
      var offsetTop = currentItem.offset().top;
  
      var columnInfoPanel = $("#column" + currentItem.innerText);
  });
  </code></pre>
  
  <p>So the immediate thought of some would be don't use <code>$(this)[0]</code>. Instead, I should use <code>$(this)</code>, and you are correct! Where the other problem comes into play is by removing the array index, <code>currentItem.innerText</code> is now <code>undefined</code>.</p>
  
  <p>The only thing I can think of is I'll have to mix both, but it seems like there should be a way to use the selector and get both options.</p>
  
  <p>What have you all done?</p>
  
  <p>Thanks,
  Kelly</p>