Interação de vários botoes, a seus conteúdos distintos

Ola, tenho um botao, com a funcao de trocar uma determinada div com seu conteudo, a minha pergunta eh, se eu tivesse por exemplo, sete botoes, cada botao e uma parte do site, cada um com sua determinada div distintas, como se faz para cada botao mudar para div? sendo que as divs nao sao os proximos elementos, estao em blocos diferentes, obrigado!!

let botao1 = document.getElementById('botao1'); let imagemcentro = document.getElementById('imagemcentro'); let conteudo1 = document.getElementById('conteudo1');   botao1.addEventListener('click', function() { if(imagemcentro) {    imagemcentro.style.display = 'none';    conteudo1.style.display = 'flex'; } else {    imagemcentro.style.display = 'flex'; } })
#imagemcentro { 	display: flex; }  #conteudo1 { 	display: none; }  .aparecer { 	display: flex; }
<!DOCTYPE html> <html> <head> 	<title>sub</title> 	<link rel="stylesheet" type="text/css" href="style.css"> </head> <body> 	<div id="imagemcentro">IMAGEM</div> 	<div id="conteudo1">Conteudo1</div> 	<button id="botao1">button</button> 	<script type="text/javascript" src="sub.js"></script> </body> </html>