javascript - evento - td onclick function jquery

¿La función jQuery.click no funciona en la etiqueta<td>?

Question

Así que estoy creando una tabla con Javascript y jQuery, y la quiero para que cuando haga clic en los td en la primera fila de la tabla, el resto de los td en esa columna se desplieguen. Déjame intentar explicarlo mostrando mi código. Aquí está mi Javascript:

function createTr (heights) { //heights is just an array of words
for (var h=0; h<heights.length; h++) {
var theTr = $("<tr>", { id: "rowNumber" + h});
for (var i=0; i<heights.length-3; i++) {
theTr.append($("<td>", { "class": "row"+h + " column"+i,
html: heights[h][i]
}));
}
$(''#newTable'').append(theTr); // append <tr id=''rowNumber0''> to the table (#newTable), which is written in the html
}
}

Esto crea básicamente td''s y cada td es similar a este formato

<td class="rowh columni">

Lo quiero para que todos los td estén ocultos excepto los td en .row0 y si hace clic en td en .row0 .columni, aparecerán todos los td en .columni. El parámetro ''alturas'' es solo una matriz, por ejemplo, puede ser

var heights = [[''headerOne'', ''headerTwo''], [''someTd'', ''anotherTd''],];

y crearía una tabla usando esas palabras, headerOne y headerTwo estarían en la primera fila, someTd y anotherTd estarían en la segunda fila.

Ahora, cuando intento agregar una función de clic como tal

function animation() {
$(''td'').click( function() {
alert(''clicked'');
});
}

y luego llamalo en mi documento. Funciona así

$(document).ready( function() {
createTr(heights);
animation();
});

no hace nada cuando hago clic en un td. ¿Cómo?

Answer 1

Este código funciona bien:

$(document).ready(function(){
$("td").click(function(){
if(this.title!=""){
alert(this.title);
}
});
});

Answer 2

Me gusta esto.-

 $("#table tr").click(function(){
console.log(this);
});

Answer 3

Prueba de esta manera:

$(''body'').on(''click'',''td'', function() {
alert(''clicked'');
});

Answer 4

prueba esto

function animation() {
$(document).on(''click'',''td'',function() {
alert(''clicked'');
});
}

Answer 5

http://api.jquery.com/on/

Ya que estás creando los elementos después de que se ha creado el DOM. Utilice el selector "on" para obtener el elemento preciso que se crea de forma dinámica.

De la URL:

 $("#newTable").on("click", "td", function() {
alert($( this ).text());
});