你得先了解一下原來on的傳送參數為何
.on( events [, selector ] [, data ], handler )

這用來解釋你第一與第二。
請多多看教學文件啦，不要說看到英文就不去了解。

其中有[]代表是可不需要給與。
所以正常只要使用你第一個寫法。就可以使用on。給與觸發事件與運行程式就好。

這邊就需要來解釋第二個程式碼中的 selector
這邊jquery他是用變數類型來做區分是什麼。一般來說如果是json格式的，就是傳送資料。
字串格式的，就是指定物件也就是元素指定名。

從你第二個程式碼來看，因為並不太確定selector是字串還是json或obj格式的東西。
所以並不太確定它是屬於元件指定還是資料傳送。(雖然從命名來看是元件指定)

第三個寫法，其實跟on比較無直接關係了。
一般就是直接綁定事件都元件上。

跟on不同的是，它並不會作用於後來產生的元件上。on會幫你將後來產生的元件上掛上事件。

這邊再教一個小東西
其實有關於on事件的指定。其$(selector)中所指定的元件。你可以將其視為主要作用城。
只要是在該作用域上新增的元件，只要符合就會自動掛載你所指定的事件動作。
但如果是在該作用域外所指定的元件。則不會幫你自動綁定事件。

所以一般來說，如果是想要全域性的的自動掛載。
大多數會用

$(document).on('click','#select',function(){})
或
$(body).on('click','#select',function(){})

不過將作用域設定在document其實也不好。等於是每一次新增元件的情況下。都還要run一次檢查並綁定事件處理。
可以的話最好還是限定在你知道的區塊內。盡量不要讓它全域作用。

補充說一下，一般來說，如果你並不會用到append....等這些插入元件控制用的語法。
使用第三個程式寫法就行了，不需要用到on處理。
在某些情況下，on最好還是少用。不得已非要用到的情況才去使用它會比較好。

1、3相等，3是1的語法糖。

2是事件委派的寫法。
如果你在頁面新增DOM，屬於某個class。
剛好這個class又有做事件綁定。那用上面的寫法，事件不會自動綁訂在該新增的DOM上。
用2的寫法，將事件綁訂在父元素上，透過事件捕獲和冒泡，你就可以自動將事件綁在新增的DOM上。

通常是不建議直接綁在最上層的body或document上，會影響效能。
（不過有時候懶還是會直接綁啦）