How can i make span-element in dynatree title clickable

Question

I use dynatree to get a tree view. When I click on a node's span element i. e. Trowin Druisheim 1 <span class='seeding_list'>3</span>, then a click event should be fired but the event doesn't fire.

The following is my used code:

$('.seeding_list').click(function() {
    alert($(this).text());
});

More you can see in this fiddle: http://jsfiddle.net/aA76N/6/

Answer 1

The event doesn't fire, because the span elements don't exist at the time you attach the click handler.

To attach event handlers for not yet existing elements, you can use a delegated event handler

Delegated events have the advantage that they can process events from descendant elements that are added to the document at a later time. By picking an element that is guaranteed to be present at the time the delegated event handler is attached, you can use delegated events to avoid the need to frequently attach and remove event handlers. This element could be the container element ...

This means, you can take an already existing element, like div#tree-team or div.panel-body

$('#tree-team').on('click', '.seeding_list',function() {
    alert($(this).text());
});

See modified JSFiddle

Answer 2

Try this:

$(document).on("click", ".seeding_list", function(){
    alert($(this).text());
});