El código con el que estoy luchando se basa en esta respuesta

mi problema es que la tabla para la que quiero usar esto se crea dinámicamente. El archivo HTML de origen solo tiene una etiqueta <table> vacía que se llena según el archivo enviado por el usuario. Copié la tabla que crea en mi archivo HTML y el código funcionó.

Esta tabla es parte de un proyecto django, y todo el javascript involucrado en la creación de la tabla ocurre en utils.js.

He intentado modificarlo así.

 $("#our_table") .mousedown(".th", function () { document.getElementById("demo").innerHTML = "Hello JavaScript!"; isMouseDown = true; $(this).toggleClass("highlighted"); return false; // prevent text selection })

basado en esta respuesta, lo mismo para .mouseover y .bind. Probé algunas variaciones como usar th sin el punto, "tr th", ".tr.th" y posiblemente algunas que olvidé

el método .on no parece funcionar para mí en absoluto; cuando hago esto

 $("#our_table th") .on('mousedown', function () { document.getElementById("demo").innerHTML = "Hello JavaScript!"; isMouseDown = true; $(this).toggleClass("highlighted"); return false; // prevent text selection }) .on("mouseover", function () { if (isMouseDown) { $(this).toggleClass("highlighted"); } }) .on('bind', "selectstart", function () { return false; // prevent text selection in IE });

ni siquiera funciona en una tabla creada no dinámicamente