Tienes varias cosas raras en tu código, pero primero lo que has pedido.
Para conseguir lo que preguntas simplemente agrega esta línea en la función actual del focusout antes de entrar en el bucle for
:
$('#dynamic_field').empty();
De tal forma que quedaria así:
$('#cantidad').focusout(function() {
var x = $(this).val();
var a = 0;
var o = 1;
// console.log(x);
a++;
o++;
$('#dynamic_field').empty();
for ($i = 1; $i < x; $i++) {
$('#dynamic_field').append('<tr id="row' + o + '"><td><input type="text" name="numeroSerie[]" id="numeroSerie' + a + '" placeholder="Ingrese número de serie" class="form-control name_list"/></td></tr>');
}
});
No te hace falta controlar el onchange
de este modo.
Pero eso te va a causar un problema inesperado, y es que al empezar el bucle con i=1 te va a faltar un elemento cada vez que lo ejecutes.
Por lo tanto, vamos a cambiar varias cosas, como decia al principio, y vamos a acabar dejando el código así:
$('#cantidad').focusout(function() {
var x = $(this).val();
var a = 0;
var o = 1;
// console.log(x);
$('#dynamic_field').empty();
for (i = 0; i < x; i++) {
a++;
o++;
$('#dynamic_field').append('<tr id="row' + o + '"><td><input type="text" name="numeroSerie[]" id="numeroSerie' + a + '" placeholder="Ingrese número de serie" class="form-control name_list"/></td></tr>');
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-xs-12 col-sm-9 col-md-6">
<div class="form-group" id="addMore">
<strong>Cantidad:</strong>
<input class="form-control" type="text" name="cantidad[]" id="cantidad">
</div>
</div>
<div class="container" id="content">
<br />
<div class="form-group">
<div class="table-responsive">
<table class="table table-bordered">
<thead>
<th>Número de serie</th>
</thead>
<tbody id="dynamic_field">
<tr>
<td><input type="text" name="numeroSerie[]" id="numeroSerie" placeholder="Ingrese número de serie" class="form-control name_list" /></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>