javascript - How can I make an <a href> only active on mobile devices?

Question

I want to add this code to make the contact details on my website automatically jump into a mobile dialpad/address book when clicked:

<a href="tel:12345555555">Call Us Now</a>

How can I make it appear as plain text for non-telephone devices (computers, tablets, laptops) so that it doesn't return a 404 error and cannot be clicked?

Happy to use any combination of HTML/CSS/JS to achieve this.

Answer 1

Don't use a hyperlink. Use microdata. Mobile phones will recognize that it is a phone number and allow it to be clicked but it won't affect normal web browsers.

<div class="vcard">
    <div class="tel">
        12345555555
    </div>
</div>