separation of repeating jquery code from html

separation of repeating jquery code from html

Hi
i am using jquery and jqueryui and don't know where my question belongs. it looks like most relevant to jquery so posting here.

the problem is that on one of web page table is generated from a database table  and for each row i has to perform the fucntion whatever user click. i have send, delete, move and copy operation for each row of table.

when there are few rows webpage loads as usual but when there are more than 50 rows i takes too much time to load. the only thing i can think of now is because of repeating code like below for every row. as i have 4 different function so it is almost repeated 200 times for 50 rows.

i feel that i am doing something wrong here.
how i can improve code here and separate javascript from rest of the code





  1. <a id="deleteDocDialog{$id}" href="#" title="Delete">Delete</a>
        <div  class = "moveSendDeleteDialogs" id="deleteDialog{$id}" title="Delete">
            <p>Are you Sure?</p>
                <form action="index.php" method="post">
                   
                    <input type="hidden" name="itemid" id="delete_itemid" value="{$id}"/>

                                                <input type="submit" value="delete" />
                                                <a id="deleteDocDialogCancel{$id}" href="#">cancel</a>
                                            </form>

                                        </div>

                                        {literal}
                                            <script type="text/javascript">
                                                $(document).ready(function(){

                                                    $("#deleteDialog{/literal}{$id}{literal}").dialog({ autoOpen: false, modal:true });

                                                    $("#deleteDocDialog{/literal}{$id}{literal}").click(function() {
                                                        $("#deleteDialog{/literal}{$id}{literal}").dialog('open');
                                                    }) ;

                                                    $("#deleteDocDialogCancel{/literal}{$id}{literal}").click(function() {
                                                        $("#deleteDialog{/literal}{$id}{literal}").dialog('close');
                                                    }) ;

                                                });

                                            </script>
                                        {/literal}






























thanks