JSFiddle - React, Tailwind, and code Playground
HTML
<!--ПЕРВЫЙ НОМЕР -->
<div class='number' data-str='KDA5OCkgNjMxLTQxLTUx'> 
<i class='fa fa-phone'> </i><a class='number_hide'>(xxx) xxx-xx-xx</a>
<span class='sh_num'>Показать</span>
</div>
<!--ВТОРОЙ НОМЕР /ЯНДЕКС! ДЛЯ ВТОРОГО НОМЕРА kuzn_t03-->
<div class='number' data-str='KDA5OCkgNjMxLTQxLTQz'> 
<i class='fa fa-phone'> </i><a class='number_hide'>(xxx) xxx-xx-xx</a>
<span class='sh_num2'>Показать</span>
</div>
CSS
.sh_num,.sh_num2{cursor:pointer;color:rgba(37,34,34,0.54);border-bottom:1px dotted #526F94;}.number_hide::before { content: "+38 ";}.sh_num:hover {color:#818080; }
JavaScript
//<![CDATA[
// Показать скрытые данные по клику мышки
// Base64. Мобильный номер
$('.sh_num', '.sh_num2').click(function(){
if( ! $(this).hasClass('on')){
$number = window.atob($(this).closest('.number').attr('data-str'))
$(this).closest('.number').find('.number_hide').text($number)
.attr('href' , 'tel:' + $number.replace(/[^0-9\+]/ig,""));
$(this).addClass('on');
$(this).hide();
}else{
$(this).closest('.number').attr('data-str', window.btoa($('.number_hide').text()));
$(this).closest('.number').find('.number_hide').text('(XX) XXX-XX-XX')
.removeAttr('href');
$(this).removeClass('on');
}
});
// яндекс
$('.sh_num').click(function(){
yaCounter43664069.reachGoal('kuzn_t02');
});
//]]>
// яндекс / второй номер
$('.sh_num2').click(function(){
yaCounter43664069.reachGoal('kuzn_t03');
});
//]]>