As I understand it, this is more or less what you need, only implement in your need.
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script><style>.container{display:grid;grid-template-columns:autoautoautoautoautoautoauto;height:500px;width:80%;margin:100pxauto0;background:#e3e3e3;grid-auto-rows:75%25%;}.container-aux{height:375px;width:80%;margin:100pxauto0;background:white;position:absolute;top:0;left:0;right:0;bottom:0;border:2pxsolidblack;}.container{display:grid;grid-template-columns:autoautoautoautoautoautoauto;height:500px;width:80%;margin:100pxauto0;background:#e3e3e3;grid-auto-rows:75%25%;}.item{border:2pxsolidblack;}.hidden{display:none;}</style><divclass="container">
<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
<div class="item">6</div>
<div class="item">7</div>
<div class="item item-link" data-dia="1">Hoje</div>
<div class="item item-link" data-dia="2">Amanhã</div>
<div class="item item-link" data-dia="3">Sáb</div>
<div class="item item-link" data-dia="4">Dom</div>
<div class="item item-link" data-dia="5">Seg</div>
<div class="item item-link" data-dia="6">Ter</div>
<div class="item item-link" data-dia="7">Quar</div>
</div>
<div class="container-aux dia1 hidden">Previsão de Hoje</div>
<div class="container-aux dia2 hidden">Previsão de Amanhã</div>
<div class="container-aux dia3 hidden">Previsão de Sabado</div>
<div class="container-aux dia4 hidden">Previsão de Domingo</div>
<div class="container-aux dia5 hidden">Previsão de Segunda</div>
<div class="container-aux dia6 hidden">Previsão de Terça</div>
<div class="container-aux dia7 hidden">Previsão de Quarta</div>
<script>
$('.item').on('click', function(){
let dia = $(this).data('dia');
$.each($('.container-aux'), function(){
if(!$(this).hasClass('hidden')){
$(this).addClass('hidden');
}
});
console.log($('.dia'+dia));
$('.dia'+dia).removeClass('hidden');
})
</script>