I'm using nodejs with socket.io, express, jade, jsdom, Jquery and mongoose and I have page elements being loaded in client side via a socket.io event from the server (which goes off scraping a few pages to get various things)

It all works and everything gets loaded in fine, but I need the run time loaded elements (either divs, list or table [i've tried them all]) to be used with jquery, after doing a bit of research I found jQueries .live, which was removed in version 1.9. So I tried the following...

$('.vid_item').on('mouseover', function(event) {
    if (event.type == 'mouseover') {
        alert('Yay, mouse-over on the loaded element');
    } else {
        // do something on mouseout
    }
});

As a test I have a '.vid_item' div in the jade layout, loaded alongside the rest of the page, and the mouse over event works perfectly on that element, but still doesn't work the items loaded in after the server comes back with it's data and fires the socket.io event to add items to the page.

Am I missing something? Can provide other bits of code from the project if needs be!

Cheers in advance!

Use it like this :

 $(document.body).on('mouseover', '.vid_item', function(event) {

The jQuery set receives the event then delegates it to elements matching the selector given as argument. This means that contrary to when using live, the jQuery set elements must exist when you execute the code. You may replace document.body with any element existing when you do the binding and in which your '.vid_item' element will be.