Tengo este código:
function celular(){
$("#celu").css("display", "inline-block") }
function email(){
$("#mail").css("display", "inline-block") }
function telefono(){
$("#fono").css("display", "inline-block") }
function gmail(){
$("#gma").css("display", "inline-block") }
function Mouseva() {
$("#celu").css("display", "none") }
function Mouseva1() {
$("#mail").css("display", "none") }
function Mouseva2() {
$("#fono").css("display", "none") }
function Mouseva3() {
$("#gma").css("display", "none") }
<div class="social">
<ul id="social">
<li><a href="mailto:[email protected]" class="icon-google-plus" onmouseenter="gmail()" onmouseleave="Mouseva3()"><p id="gma">[email protected]</p></a></li>
<li><a href="" class="icon-phone" onmouseenter="telefono()" onmouseleave="Mouseva2()"><p id="fono">1111111</p></a></li>
<li><a href="" class="icon-skype" onmouseenter="email()" onmouseleave="Mouseva1()"><p id="mail">[email protected]</p></a></li>
<li><a href="" class="icon-whatsapp" onmouseenter="celular()" onmouseleave="Mouseva()"><p id="celu">11111111</p></a></li>
</ul>
</div>
Sé que hay una forma para usar sólo una función para onmouseenter y una sola para onmouseleave, seguramente usando 'this', pero no puedo comprender cómo se hace?