<div id="myDiv">Some Content</div>

$('#myDiv').click(function(){
  //some code
});

<div id="myDiv" onClick="divFunction()">Some Content</div>

function divFunction(){
 //some code
}

var myEl = document.getElementById('myelement');

myEl.addEventListener('click', function() {
    alert('Hello world');
}, false);

myEl.addEventListener('click', function() {
    alert('Hello world again!!!');
}, false);

querySelector('#myDiv').addEventListener('click', function () {
    // some code...
});

$('span'); // 6,604 ops per sec
document.getElementsByTagName('span'); // 10,331,708 ops/sec

$('#jquery a').click(window.testClickListener); // 2,957 ops/sec

[].forEach.call( document.querySelectorAll('#native a'), function(el) {
   el.addEventListener('click', window.testClickListener, false);
}); // 18,196 ops/sec

Go for this as it will give you both standard and performance ....

 $('#myDiv').click(function(){
      //some code
    });

<div id="myDiv">Some Content</div>

$('#myDiv').click(divFunction);

function divFunction(){
 //some code
}

<whatever onclick="doStuff();" onmouseover="in()" onmouseout="out()" />

<span id="JQueryClick">Click #JQuery</span> </br>
<span id="JQueryAttrClick">Click #Attr</span> </br>

$('#JQueryClick').click(function(){alert('1')})
$('#JQueryClick').click(function(){alert('2')})

$('#JQueryAttrClick').attr('onClick'," alert('1')" )//this doesnt work
$('#JQueryAttrClick').attr('onClick'," alert('2')" )