Problem with click jquery

good I've been learning a bit of javascript and jquery for a week but I came to a problem that I could not find a solution for. What I try to do is to make a table from a table to edit its elements in this way: a table with several elements is shown, for each row there is a button, if the button is pressed that row is transformed into input values (to achieve writing in they), if the button is pressed again (a new one created with a different id), the data is sent to the database and then the row that was input in a row element of a table must be transformed again with the updated data. The problem is that the click function when clicking on the new button (with id button) does not do anything, not even show an alert or a log as indicated. Why is this happening? Thank you in advance

Function that receives the value of the fields when pressing the button for the second time (new button to confirm edition)

$(document).ready(function() {
    alert("jQuery está funcionando"); 
    jQuery("#boton").click(function(evento){
        evento.preventDefault();
        alert("se oprimio el boton"); 
    console.log("funciona"); 
        var especiee = jQuery("#especie").val();
        var generoo = jQuery("#genero").val();
        var familiaa = jQuery("#familia").val();
        var calidadd = jQuery("#calidad").val();
        var tamañoo = jQuery("#tamaño").val();
        var ciudadd = jQuery("#ciudad").val();
        var comentarioo = jQuery("#comentario").val();
        var precioo = jQuery("#precio").val();
});


                });

This function makes the form editable:

    function transformarEnEditable(nodo){
    //El nodo recibido es SPAN
    if (editando == false) {
    editando = "true";

    var nodoTd = nodo.parentNode; //Nodo TD
    var nodoTr = nodoTd.parentNode; //Nodo TR

    var nodosEnTr = nodoTr.getElementsByTagName('td');
    var especie = nodosEnTr[0].textContent; 
    var genero = nodosEnTr[1].textContent;
    var familia = nodosEnTr[2].textContent; 
    var calidad = nodosEnTr[3].textContent;
    var tamaño = nodosEnTr[4].textContent; 
    var ciudad = nodosEnTr[5].textContent;
    var comentario = nodosEnTr[6].textContent;
    var precio = nodosEnTr[7].textContent;
    var Editar = nodosEnTr[8].textContent;
    var nuevoCodigoHtml = '<td><input type="text" name="especie" id="especie" value="'+especie+'" size="17"></td>'+
    '<td><input type="text" name="genero" id="genero" value="'+genero+'" size="10"</td>'+
    '<td><input type="text" name="familia" id="familia" value="'+familia+'" size="10"</td>'+
    '<td><input type="text" name="calidad" id="calidad" value="'+calidad+'" size="5"</td> '+
    '<td><input type="text" name="tamaño" id="tamaño" value="'+tamaño+'" size="5"</td> '+
    '<td><input type="text" name="ciudad" id="ciudad" value="'+ciudad+'" size="10"</td> '+
    '<td><input type="text" name="comentario" id="comentario" value="'+comentario+'" size="20"</td> '+
    '<td><input type="text" name="precio" id="precio" value="'+precio+'" size="5"</td> '+
    '<td><input class="btn btn-primary"  id="boton" Value="aceptar" type="submit"></input></td>'+
    '<td><input class="btn btn-danger" value="eliminar" type="submit"></input> ' ;






nodoTr.innerHTML = nuevoCodigoHtml;}}

and with this I show the data:

<?php
    $conexion=mysqli_connect('localhost','root','','shells');

    $request=mysqli_query($conexion,"select especie, genero,familia,calidad,tamano,ciudad,comentario,precio from shell where habitad='land'");

    while($prueba=$request->fetch_assoc()){
?> 
    <tr class="info">

<td><?php echo $prueba['especie'] ;     ?>  </td> 
<td><?php echo $prueba['genero']   ;    ?>  </td> 
<td><?php echo $prueba['familia']   ;   ?>  </td> 
<td><?php echo $prueba['calidad']   ;   ?>  </td> 
<td><?php echo $prueba['tamano']   ;    ?>  </td> 
<td><?php echo $prueba['ciudad']   ;    ?>  </td> 
<td><?php echo $prueba['comentario'];   ?>  </td> 
<td><?php echo $prueba['precio']   ;    ?>  </td> 

<td><input type=submit name="editar" value="Editar" onclick="transformarEnEditable(this)" class="btn btn-primary"> </input> </td>
<td><input type="submit" name="eliminar" value="Eliminar" class="btn btn-danger"></input></td>
    </tr>

<?php   } ?>