$ (document) .ready (function () after inserting HTML

Question

I am trying to live editing data. For this, I found this script

http://www.9lessons.info/2011/03/live-table-edit-with-jquery-and-ajax.html

The script works fine when the table is created in the php file, but I'm trying to do this by injecting the table through javascript.

This is my php page

<script type="text/javascript" src="javascript/default/gebruikers.js"></script> <div id="adminGebruikersDiv" class="adminGebruikersDiv"></div> <script type="text/javascript"> onload = function() { loadGebruikers(); }; </script> 

The loadGebruikers function creates a table and enters it into a div. Now I want this code to work

 $j(document).ready(function() { $j(".rij").click(function() {}).change(function() {}); $j(".editbox").mouseup(function() {}); $j(document).mouseup(function() {}); }); 

So how can I do this using jquery

EDIT: now kind of work

 $j(document).on("ready", function() { $j(document).on("click", ".rij", function() {}).on("change", function() {}); $j(document).on("mouseup", ".editbox", function() {}); $j(document).on("mouseup", ".document", function() {}); }); 

Answer 1

You must use . to attach events to dynamic elements.

 $j(document).on("click", ".rij", function() { ... });