e.stopPropagation() on click event

Please tell me why the e.stopPropagation() function does not work?

$(document).on("click", ".el", function(e) {
  e.stopPropagation();
  alert(2);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="el" onclick="alert(1)";>Click</div>