Como puedo recorrer las filas de una tabla HTML y obtener los valores con un botón?
Tengo el ejemplo de una tabla que me obtiene el valor especifico de una celda al hacer clic en la fila, pero lo que requiero es que al hacer clic en un botón ok me obtenga los valores fila x fila:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$("#ok").click(function() {
var valores = "";
$(this).parents("tr").find("#numero").each(function() {
valores += $(this).html() + "\n";
});
console.log(valores);
alert(valores);
});
$(".boton").click(function() {
var valores = "";
// Obtenemos todos los valores contenidos en los <td> de la fila
// seleccionada
$(this).parents("tr").find("#numero").each(function() {
valores += $(this).html() + "\n";
});
console.log(valores);
alert(valores);
});
});
</script>
<table border="1" cellspacing="0" cellpadding="5" id="tbl">
<thead>
<tr>
<td>Nombre 1</td>
<td>Nombre 2</td>
<td>Apellido 1</td>
<td>Mantenimiento</td>
</tr>
</thead>
<tr>
<td id="numero">Kevin</td>
<td>Joseph</td>
<td>Ramos</td>
<td class="boton">coger valores de la fila</td>
</tr>
<tr>
<td id="numero">Viviana</td>
<td>Belen</td>
<td>Rojas</td>
<td class="boton">coger valores de la fila</td>
</tr>
<tr>
<td id="numero">Junior</td>
<td>Gerardo</td>
<td>Nosé</td>
<td class="boton">coger valores de la fila</td>
</tr>
</table>
<br>
<form action="">
<label for="">Nombre</label>
<input type="button" value="ok" id="ok" class="boton">
</form>
</body>
</html>