The javascript object contains divs with custom "data", but I cannot view the data

Question

I have the following code snippet:

$(window).load(function() {

  run($('.stickable'));
})

var run = function (headers){
  var $window = $(window)
  var $headers

  $headers = headers.each(function(){
    var $currentHeader = $(this).wrap('<div class="followWrap">');
    $currentHeader
      .data('startPosition', $currentHeader.offset().top)
      .data('headerHeight', $currentHeader.outerHeight())
        .parent()
        .height($currentHeader.outerHeight())
        .width($currentHeader.outerWidth())
  });
}

When I put the debugger and console headers of $ head, I get what looks like a div array. However, typeof shows that it is an object. When I try $ headers.data (), I get startPosition and headerHeight of the first div. When I try $ headers [2], I get a second div. When I try $ headers [2] .data (), I get an error. When I do the $ .each loop, I get the correct information. My question is: why can't I specify $ headers [2] .data () or just select any div and show its data?

Answer 1

, jQuery DOMElement, jQuery, data() . eq(), jQuery :

var data = $headers.eq(1).data(); // zero-based index, 2nd item = index 1