Cambiar el contenido de un div por otro

[fedefrankk]

Buenos días/tarde en el foro:
Tengo que hace un menú de 5 títulos, cuando toco un titulo me aparece un div oculto con una imagen y otro con un texto, todo lo manejo con JavaScript, o jquery para dar el efecto de fade in fadeout…
El problema es con lo que se tengo que hacer 10 div escondidos y cuando apretó titulo uno aparece uno desaparece el resto, si presiono sobre titulo 2 se tiene que esconder todos menos los dos div que corresponden al botón titulo 2.

Mi pregunta es la siguiente: existe una manera con JavaScript, o jquery de que si presiono un titulo o botón me ponga una imagen y un texto dentro de los mencionados div, sin tener que cargar los 20 divs?

Código HTML:

<li class="on_1" onclick="t_1()">TITULO1</li> 
  <li class="on_2" onclick="t_2()">TITULO2</li>
  <li class="on_3" onclick="t_3()">TITULO3</li>
 

}

Código Javascript:

function t_1(){
  var fr=document.getElementById('index').style.display='none';
  var fe=document.getElementById('trata').style.display='block';
  }
  function t_2(){
  var fr=document.getElementById('index').style.display='block';
  var fe=document.getElementById('trata').style.display='none’;
 

Dejo una imagen y muchisimas gracisa.!!!




Gracias a todos de antemano
Saludos
Fede