Survol sur un élément qui provient de la bdd

salut à tous.
J'ai un soucis depuis qui me fatigue.
en effet, j'ai des éléments dans la bdd que je recupre en php dans mon form puis j'applique un .val() sur la value pour l'avoir côté js.
Ensuite, je fait des traitement comme suit:
*************************************
function toltip(){
var h=$('#hidden').val();
console.log(h);
var arr=h.split(' ');
var title=$("#toltip");
for (var i = 0; i <= arr.length; i++)
{
if(arr.length != 1){
var tmp=arr[0]+" "+arr[1];

}else{
var tmp=arr[0];

}

}
title.attr({'title':tmp});

$('#toltip ').css('width','300px');//augmentation de la taille.
}

$(document).on('mouseover','#toltip',function()
{
toltip();
});
*******************************************
Et j'affiche le rendu côté Html:
******************************
<span class="" ><strong id="toltip" title="Information Utile" class="description">'.$tootltip.'</strong></span>
*******************************
Sa marche bien au survole mais le texte est très petit.
J'ai tenté plusieurs action mais rien raison pour laquelle je m'oriente vers ce site.

Bonjour,

Tu ne peux pas faire ça de cette manière.
Tu essaies de modifier le comportement de survol du navigateur, ça n'est pas possible, en plus chaque navigateur gérera cette action différemment, et ton code n'est pas valide (title sur une <strong>).

Il te faut passer par un plugin de tooltip qui va simuler cette effet.

Y'a l'artillerie lourde avec tooltip de jQueryUI :
https://codepen.io/anon/pen/Xgqxpy

Sinon un fait-maison inspiré du code de Grafikart :
https://codepen.io/anon/pen/KqRrpb
Et là il te suffit juste de retoucher le CSS, tu peux également ajouter des animations...

Ou autres plugins => Cf Google !