How to deal with new div loaded on scroll that isn't loaded in document.ready()?

Question

$( document ).ready(function() {
    $('a').on('mouseover', function(e) {
    e.preventDefault();

       var addressValue = $(this).attr("href");
      // console.log(addressValue);
       if (addressValue.substring(0, 12) == "http://t.co/")
        console.log(addressValue);

       //var a = '.' + srcElement.className;
     //  $(this).tooltipster({
       //         content: $("<span><strong>" + addressValue + "</strong></span>")
        //    });

  });
});

This code of mine helps me get href links out of all the links loaded in a window, but when I start scrolling, this doesn't get called anymore.

How to make it work for all the href tags loaded on scroll?

You'll need delegated event handlers `$(document).on('mouseover', 'a', function() {...` — adeneo, Jan 31 '15 at 09:09

score 1 · Answer 1 · answered Jan 31 '15 at 09:10

You need this:

$( document ).ready(function() {
    $(document).on('mouseover', 'a', function(e) {
    e.preventDefault();

       var addressValue = $(this).attr("href");
      // console.log(addressValue);
       if (addressValue.substring(0, 12) == "http://t.co/")
        console.log(addressValue);

       //var a = '.' + srcElement.className;
     //  $(this).tooltipster({
       //         content: $("<span><strong>" + addressValue + "</strong></span>")
        //    });

  });
});

How to deal with new div loaded on scroll that isn't loaded in document.ready()?

1 Answers1