Crear nueva fila en una tabla sin errores

[nades]

Hola!
Tengo una tabla donde selecciono un producto y me arroja el precio a través de una consulta PHP con una función JQUERY. Hasta aquí todo va bien.
Cuando agregó una nueva fila (esto también lo realizo con función Javascript) los elementos y el procedimiento tiene que ser el mismo. Solo que al seleccionar un producto diferente ya no cambia el precio. Podrían ayudarme?

Código Javascript:

//Muestra precio a partir de consulta php
$(document).ready(function(){
  $('#producto').change(function(){
     var id=$('#producto').val();
     $('#precio').load('precio.php?id='+id);
  });    
});
 
$(function(){
//Clona la fila oculta que tiene los campos base, y la agrega al final de la tabla
  $("#agregar").on('click', function(){
     $("#tabla tbody tr:eq(0)").clone().appendTo("#tabla tbody");
  });
});
 

Código PHP:

<table id="tabla">
    <thead>
      <tr>
        <td>Descripción</td>
        <td>Precio</td>
      </tr>
    </thead>
 
      <tr>
        <td><select name="producto" id="producto">
              <option value="0">-- Seleccione --</option>
            <?php
            $productos = mysql_query("SELECT * FROM productos ORDER BY nombre") or die(mysql_error()); 
            while ($datos_prod = mysql_fetch_array($productos)){
              echo '<option value="'.$datos_prod['0'].'" >'.$datos_prod['1'].'</option>';
            }
            ?>
            </select></td>
        <td><div id="precio"></div></td>
      </tr>
      
    </table>
    <input type="button" id="agregar" value="Agregar" />
 

precio.php

Código PHP:

include ("inc/conexion.php");
$consulta = mysql_query("SELECT * FROM productos WHERE id_producto=".$_GET['id']); 
$row=mysql_fetch_array($consulta); 
echo '$'.$row["2"].'';
 

¿Pueden ayudarme?