Eyad Fallatah
Eyad Fallatah

Reputation: 1948

mouseover does not work after prepending

I am using the following to prepend new tweets to the list of tweets that I currently have

$(newTwet).clone().hide().prependTo('#tweetsList').slideDown();

newTweet is a variable that holds HTML code that is coming from a POST request. Which contains

<div class="newTweet">.........</div>

Everything seems to work just fine. However, the .newTweet class that is being prepended to the #tweetlist has an associated mouseover/mouseout function that does not work until I refresh the page. Is there a way to fix this?

Upvotes: 2

Views: 264

Answers (3)

David Thomas
David Thomas

Reputation: 253308

Without seeing your actual script, particularly the part that handles the mouseover, it's difficult to say. But I'd suggest that you need to use on() (or delegate() in jQuery versions less than 1.7):

$('#parentElementID').on('mouseover','.newTweet',
    function(){
        // do stuff
    });

Or with delegate():

$('#parentElementID').delegate('.newTweet','mouseover',
    function(){
        // do stuff
    });

In jQuery 1.7 live() was deprecated, and replaced by on(), and prior to 1.7 delegate() is recommended:

As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live(). [Cited from: jQuery API reference for live().

Upvotes: 4

Seyeong Jeong
Seyeong Jeong

Reputation: 11028

Try with:

$(newTwet).clone(true).hide().prependTo('#tweetsList').slideDown();

Here is a .clone() documentation.

Upvotes: 0

user862010
user862010

Reputation:

Use .live('mouseover',function(){});

Upvotes: 1

Related Questions