Modal Help View Product Details Jquery

Question

I have a page that selects products in the ring case, and I would like that when clicked on see details select that product, but only appear to me the first always, with the same id. below the Code: the php file:

    $paginaAtual = isset($_GET['pagina']) ? (int)$_GET['pagina'] : 1;
    $porPagina = 3;
    $catId = '1';
    //$aneisPaginator = \controllers\aneisController::readPaginator('tb_admin.produtos',$catId,($paginaAtual - 1) * $porPagina,$porPagina);
    $aneisPaginator = \controllers\aneisController::readPaginator('tb_admin.produtos',$catId,0,0);
    $start = ($paginaAtual - 1) * $porPagina;
    $teste = \Mysql::conectar()->prepare("SELECT * FROM `tb_admin.produtos` WHERE `categoria_id` = $catId LIMIT $start,$porPagina");
    $teste->execute();
    $teste = $teste->fetchAll();

 ?>
<div class="container">

    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="<?=INCLUDE_PATH?>">Home</a></li>
            <li class="breadcrumb-item active" aria-current="page">Aneis</li>
        </ol>
    </nav>
    <h2>Aneis</h2>
    <div class="row">
        <?php 
            //$aneis = \controllers\aneisController::listarAneis('1');
            $pesquisa = \Mysql::conectar()->prepare("SELECT DISTINCT id FROM `tb_admin.produtos`");
            $pesquisa->execute();
            $pesquisa = $pesquisa->fetch()['id'];
            foreach($teste as $anel):
                $imagesAneis = \controllers\aneisController::listarImagens($anel['id']);
                foreach($imagesAneis as $images):
         ?>
        <div class="col-md-3 container-anel" id="<?= $anel['id']?>">
            <div class="aneis_container">
                <div class="aneis_container_img">
                    <img src="<?=INCLUDE_PATH_PAINEL?>uploads/<?=$images['imagem']?>">
                </div>
                <div class="aneis_descricao">               
                    <p><?=$anel['descricao']?></p>
                    <h2 class="title-preco">R$ <?=$anel['preco']?></h2>
                    <div class="aneis_descricao_preco">
                        <span class="ver-detalhes"><a class="link-box" data-a="<?=$anel['id']?>" href="#box-id">Ver Detalhes</a></span>
                    </div>
                </div>
            </div>
        </div>

        <?php endforeach; ?>
        <?php endforeach; ?>
        <div class="box-aneis-container" id="box-id <?= $anel['id']?>">
            <i class="fas fa-times close"></i>
            <?php 
                $boxProdutos = \Mysql::conectar()->prepare("SELECT * FROM `tb_admin.produtos` WHERE id = ?");
                $boxProdutos->execute(array($anel['id']));
                $boxProdutos = $boxProdutos->fetchAll();
                foreach($boxProdutos as $produtos):

             ?>
            <div class="box-aneis-content" id="<?= $anel['id']?>"> 
                <div class="box-aneis-images">
                    <img src="<?=INCLUDE_PATH_PAINEL?>uploads/<?=$images['imagem']?>">
                </div>
                <div class="box-aneis-descricao">
                    <h1>Descricao do Produto</h1>
                    <p><?=$produtos['descricao']?></p>
                    <h2 class="title-preco">R$ <?=$produtos['preco']?></h2>
                </div>
            </div>
            <?php endforeach; ?>
        </div>

    </div>
    <nav aria-label="...">
        <?php 
            $totalPaginas = ceil(count(\controllers\aneisController::readPaginator('tb_admin.produtos',$catId)) / $porPagina);
         ?>
        <ul class="pagination justify-content-center">
            <?php 
                for($i = 1; $i <= $totalPaginas; $i++):
                    if($i == $paginaAtual):
                        echo '<li class="page-item active" aria-current="page">
                        <a class="page-link" href="'.INCLUDE_PATH.'aneis?pagina='.$i.'">'.$i.' <span class="sr-only">(current)</span></a>
                        </li>';         
                    else:
                        echo '<li class="page-item"><a class="page-link" href="'.INCLUDE_PATH.'aneis?pagina='.$i.'">'.$i.'</a></li>';
                    endif;
                endfor;

             ?>
            <!--<li class="page-item disabled">
                <a class="page-link" href="#" tabindex="-1" aria-disabled="true">Anterior</a>
            </li>

            <li class="page-item"><a class="page-link" href="#">1</a></li>
            <li class="page-item active" aria-current="page">
                <a class="page-link" href="#">2 <span class="sr-only">(current)</span></a>
            </li>
            <li class="page-item"><a class="page-link" href="#">3</a></li>

            <li class="page-item">
                <a class="page-link" href="#">Proximo</a>
            </li>-->
        </ul>
    </nav>
    <div class="wats-fixed">
    <i class="fab fa-whatsapp"></i>
  </div>
</div>

and the jquery file:

$(function(){

$('.buscar').focus(function(){
    $(this).animate({width : '300px'});
});

$('.buscar').blur(function(){
    $(this).animate({width : '200px'});
});

$('document').ready(function(){

    $('.link-box').click(function(e,data){

    var linkBox = $('.link-box').attr('data-a');
    console.log(linkBox);

    e.preventDefault(data);
    $('.overlay-loading').fadeIn();


    $.ajax({
        url: include_path +'aneis.php',     
        data: {'box-id': linkBox},
        success: function(result){
            //var teste = $('.ver-detalhes').attr('id');
            //console.log(result);

                    var boxId = $('.box-aneis-container').attr('anel-id');
                    var colunaId = $('.container-anel').attr('id');
                    var containerAnel = $('.container-anel');
                    var boxId = $('.box-aneis-container').attr('id');

                    //boxId.css({'display': 'block'});
                    $('.box-aneis-container').html(colunaId);
                    $('.box-aneis-content').fadeIn();       


                    $('.box-aneis-content').fadeOut();      


            }   


        });

    });

});




$('.box-aneis-container .close').click(function(){
    $('.box-aneis-container').fadeOut();
    $('.box-aneis-content').fadeOut();      
    $('.overlay-loading').fadeOut();    
});

}); if any help I will be grateful!