How to use jquery to gracefully monitor events for dom binding?

  node.js, question

For example

$('.j_submitForm').on('click', function() {
 // XXX
 });
 $('.j_buyBtn').on('click', function() {
 // XXX
 });
 $('.j_callTopbar').on('click', function() {
 // XXX
 });
 $('.j_closeDialog').on('click', function() {
 // XXX
 });
 .......

When there are many binding events, it becomes like this. It is not easy to understand and maintain. What elegant method is there to bind dom events for easy management, and is there any scheme such as event binding manager?
I am also looking for the best solution and have found a timely update.

The essence of the problem is that Anonymous function used to tie up one event is concise, and tying up multiple events is chaos.

(function($view, $) {
 //All events are put together like routing tables.
 $view
 .on('click', '.j_submitForm', submit)
 .on('click', '.j_buyBtn', buy)
 .on('click', '.j_callTopbar', call)
 .on('click', '.j_closeDialog', closeDialog);
 
 //The logic for handling events is written separately
 function submit() {
 //todo
 bracket
 function buy() {
 //todo
 bracket
 function call() {
 //todo
 bracket
 function closeDialog() {
 //todo
 bracket
 })(jQuery(document.body), jQuery)

Classic old answer = >https://segmentfault.com/q/1010000000633373/a-1020000000633785