jQuery - events won't fire for dynamically created tab elements..

Posted by Amit on Stack Overflow See other posts from Stack Overflow or by Amit
Published on 2010-04-01T11:27:43Z Indexed on 2010/04/01 11:33 UTC
Read the original article Hit count: 308

Filed under:
|

Hi,

I am using jQuery UI Tabs.

<div id="tabs">
<ul id="tablist">
    <li><a href="#fragment-1"><span>One</span></a></li>
</ul>
</div>

I have a button that adds new tabs. I use the following code:

var newTabId = $('#tabs').tabs('option', 'selected') + 1;    
$('#tabs').tabs("add",'someUrl.htm','New Tab',newTabId);

(Tab will be added next to the currently selected tab)

Now none of the newly added tabs fire any events such as a click or hover

$('#tablist li').click(function(){
    alert('test message');
});

But events fire properly for the tabs that were there in the initial source code.

How to resolve?

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about jquery-events