Add tel: to phone number after calling it from database php

I’m using this to call phone number from database

<button id="phone-number-button" data-item-id="<?php echo $itemInfo['id']; ?>" data-phone-number="<?php echo $itemInfo['phoneNumber']; ?>" class="btn btn-primary mb-2 phone-hidden">

and hiding it with this :

<i class="fa fa-phone mr-1"></i>
<span>XXX-XX<small> <?php echo $LANG['action-show']; ?></small></span>
</button>

this is JavaScript i use to show and hide the phone number

            $this.find('span').text($(this).attr('data-phone-number'));
        
        

        var itemId = $(this).attr('data-item-id');

        if ($this.hasClass("phone-hidden")) {

            $this.removeClass("phone-hidden");

            $.ajax( {
                type: "POST",
                url: App.api_path + "items.phone",

what I want is to add <a href=”tel:phoneNumber so the phone number will be clickable one the article page

you can see the link here : https://www.lhawta.ma/classified/appartement-meuble-en-plein-centre-31f69.html

Answer

Try the following. Save the number to a Javascript variable, then assign it to your HTML element as follows:

Document.getElementById("Your HTML element").href = yourNumberVarible;
Document.getElementById("Your HTML element").innerHTML = "tel: "+ String(yourNumberVarible);