javascript - Event Listener Best Practices for web app -

i'm making web app, , javascript collecting quite few $(document).on event listeners. working enough me, feels there must better way organize it. here's sample:

    // send quiz info via ajax, load form first question.     $(document).on('click', '#create-new-quiz', function(){         createnewquiz();         $('#forms').load("dash/workspace.php", {             action : 'get-new-question'         });     });       // load form create first question     $(document).on('click', '#finish-quiz', function(){         addquestion();         $('#forms').load("dash/workspace.php",{             action : 'finish-quiz'         });     });       //call function add new question via ajax when button clicked.      $(document).on('click', '#add-question', function(){         nextaction = "add-question";         addquestion();     }); 

that shows have variety of buttons dynamically added , removed form dom. when clicked, function called.

any suggestions? on right path, or there better way organize this?

i find $('#button').click(function(){}) shortcut tidier.

also, first 2 event handlers similar , made bit more generic i.e. passed action variable:

$('.quizbutton').click(function(e){     createnewquiz();     $('#forms').load("dash/workspace.php", {         action : $('this').data('action');     }); });