jQuery code placement problem

[khaos337]

I am new to using jQuery and any help with this would be greatly appreciated.I am using a jQuery mask for a date input field, as well as a watermark. Here is the call:

<script type="text/javascript">jQuery(function($){$("#date").mask("9999/99/99");});jQuery(function($){$("#date").Watermark("YYYY/MM/DD");});function UseData(){$.Watermark.HideAll();$.Watermark.ShowAll();}</script>

My problem is this... Everything works great, however this date field is in a dynamic table where the user can add and delete rows as necessary. However, when a new row is added using javascript the JQuery is not applied to the new input tags with id=date. Where do I need to put this jQuery code so that it will apply itself to all rows added after the page is loaded?

[ShadowMage]

This is precisely what the live() function is for. I've never used it, so I can't be 100% sure on the syntax of it, but I think the documentation shows how to use it pretty well.

[khaos337]

This is precisely what the live() function is for. I've never used it, so I can't be 100% sure on the syntax of it, but I think the documentation shows how to use it pretty well.

That is definitely what I'm looking for. I also am having a problem with the syntax of incorporating it with a jQuery plugin and not just jQuery code. Does anyone out there have some experience with this stuff??

[skaterdav85]

I've actually had to do this before (making a plugin work on new elements added to the DOM) with the fancybox jQuery plugin. Here was my code of incorporating live() into use with fancybox.

$('a.fancybox').live('mouseover', function(){    $(this).fancybox({		'scrolling' : 'no',		'titleShow' : false   })});

Basically you take your selection that will trigger the plugin, apply the live() method, which runs an anonymous function on the mouseover event that applies the plugin to the current object being moused over, in my case, the fancybox() method. Hopefully that makes sense