Mi problema es el siguiente.Tengo un botón que añade inputs de textos.Uno de ellos guardara un código de color.Para una mejor experiencia de usuario deseo que ese color pueda elegirse con el plugin Boostrap ColorPicker.Mi problema es que cuando genero las cajas de texto no me detecta el plugin,sin embargo para una caja de texto que no es generada dinamicamente si lo detecta.Abajo pongo link de un ejemplo con todo el código con la caja de texto fija y el botón que las genera dinamicamente.Gracias de antemano. Enlace ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Colorpicker using Bootstrap 3</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-colorpicker/2.5.3/css/bootstrap-colorpicker.css"
rel="stylesheet">
<script src="https://code.jquery.com/jquery-2.2.2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-colorpicker/2.5.3/js/bootstrap-colorpicker.js"></script>
</head>
<body>
<div class="col-md-2 col-md-offset-6">
<label for="">Example picker</label>
<div id="" class="cp-component input-group">
<input type="text" value="#269faf" class="form-control" />
<span class="input-group-addon"><i></i></span>
</div>
</div>
<div class="col-xs-12 col-md-6">
<input type="button" value="Add" class="btn btn-azul" id="insertar_intervalo">
<div class="intervalos">
</div>
</div>
</body>
</html>
archivo js
$('.cp-component').colorpicker();
var contador = 0;
$(document.body).on('click', '#insertar_intervalo', function (e) {
contador = contador + 1;
$('.intervalos').append(
`
<div class="well well-sm contenedor-intervalos"id="contenedor-intervalo-${contador}">
<div class="row fila-contenido-evaluaciones">
<div class=" col-md-4">
<label for="">Desde</label>
<input type="text"name="desdes[]"class="desdes form-control">
</div>
<div class=" col-md-4">
<label for="">Hasta</label>
<input type="text"name="hastas[]"class="hastas form-control">
</div>
<div class=" col-md-4">
<label for="">Color</label>
<div id="cp-component-${contador}" class="cp-component input-group">
<input type="text" value="#269faf" class="form-control" />
<span class="input-group-addon"><i></i></span>
</div>
</div>
</div>
</div>
`
);
});