0

I appreciate that this questino has been asked before, I have trawled the answers on StackOverFlow but none of the solutions work in my case.

Simple setup:

I have a row of boxes, when you mouse over and away from a box an alert appears. Click the text to clear the div and make a new box. The new box won't respond to the mouseover.

I know this has something to do with DOM events and page loads but I just cannot find a solution.

I am using:

$('.box').on('mouseenter', function(){});

I have also tried using .live

Here is my fiddle:

http://jsfiddle.net/d2PWH/3/

Thank you in advance.

ALan.

Alan A
  • 2,301
  • 6
  • 26
  • 46
  • possible duplicate of [Event binding on dynamically created elements?](http://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements) – Barmar Apr 16 '14 at 18:07
  • Always include **all** the relevant code and markup **in** the question, don't just link, not even to jsFiddle. The question becomes meaningless if jsFiddle goes away, and regardless people shouldn't have to go off-site to help you. – T.J. Crowder May 27 '14 at 17:12

1 Answers1

1

Event delegation! Target an element that exists on load!

$(".row").on("mouseenter", ".box", function() {
tymeJV
  • 99,730
  • 13
  • 150
  • 152
  • @AlanA: If this *answered* your question, the way SO works, you'd "accept" the answer by clicking the empty checkmark next to it. More in the help center. – T.J. Crowder May 27 '14 at 17:11