JSFiddle - React, Tailwind, and code Playground

HTML

<div id="teste"></div>

CSS

#teste {
  width: 50%;
  height: 100px;
  margin: 50px auto;
  border: 1px solid red;
  background-color: #622;
}

JavaScript

$('#teste').on('click', function(e) {
  console.log(1, e.type);
}); // 3
$('#teste').on('mousedown', function(e) {
  console.log(2, e.type);
}); // 1
$('#teste').on('mouseup', function(e) {
  console.log(3, e.type);
}); // 2
$('#teste').on('click', function(e) {
  console.log(4, e.type);
}); // 4

// Alterando a ordem

// Salva eventos originais de click
var eventosOriginais = jQuery.extend(true, {}, $._data($("#teste")[0], "events").click);
// Apaga os eventos
$('#teste').off('click')
// readiciona os eventos na ordem desejada
$('#teste').on('click', function(e) {
  eventosOriginais[1].handler(e);
  eventosOriginais[0].handler(e);
})