Open image in div after loading with jquery

I have this jquery code that makes a filter, when it shows the result, it opens in a div id = products , this div will have thumbnails and I want it click on the image and it appears in an enlarged div on the side.

The filter is working, what does not work is loader to load image on the side.

Could you help me solve this problem to work the jquery to appear the image in a div after the filter result appears?

$(document).ready(function(){
    $('a.loader').on('click', function(e) {
    e.preventDefault();
    $('#content_simulador').load($(this).attr('href'));
});
$('#categoria').on('change',function(){
        var categoriaID = $(this).val();
        if(categoriaID){
            $.ajax({
                type:'POST',
                url:'admin/ajaxData_simulador2.php',
                data:'categoria_id='+categoriaID,
                success:function(html){
                    $('#subcategoria').html(html);
                    $('#produtos').html('<div class="container"><div class="col-md-12 filtro_simulador"><i class="fa fa-arrow-up" aria-hidden="true"></i> Selecione uma subcategoria</div></div>'); 
                }
            }); 
        }else{
            $('#subcategoria').html('<option value="">Selecione uma categoria</option>');
            $('#produtos').html('<div class="col-md-12">Selecione um produto</div>'); 
        }
    });

    $('#subcategoria').on('change',function(){
        var produtosID = $(this).val();
        if(produtosID){
            $.ajax({
                type:'POST',
                url:'admin/ajaxData_simulador2.php',
                data:'produtos_id='+produtosID,
                success:function(html){
                    $('#produtos').html(html);
                }
            }); 
        }else{
            $('#produtos').html('<div class="col-md-12">Selecione um produto</div>'); 
        }
    });
});