Geek asks and answers

How to dynamically add anchor / href in jQuery

Im new for jQuery, and I'm trying to convert my entire phone class to have a binding with href:

What i have

<div class="phone">111-111-1111</div>
<div class="phone">666-555-4444</div>

What I want

<div class="phone"><a href="tel:111-111-1111">111-111-1111</a></div>
<div class="phone"><a href="tel:666-555-4444">666-555-4444</a></div>

I'm trying to do something like this, but I'm pretty lost:

$('.phone').each(function(){
  $(this).wrapInner('<a name="???' + $(this).html() + '" />');
});
+5
source share
5 answers

I think the solution is only in your question ...

Look at this.

$('.phone').each(function(){
    $(this).wrapInner('<a href="tel:' + $(this).html() + '" />');
});​

FIDDLE Hope this is what you want.

+6
source 
$(".phone").each(function(index, element){
    $(element).html($("<a></a>").attr("href", $(element).text()).text($(element).text()));
});
+4
source

try it

$('.phone').each(function(){
   $(this).append('<a href="' + $(this).html() + '">'+$(this).html()+'</a>');
});
+2
source

Enter this code:

$('.phone').each(function(){
    $(this).html('<a href="tel:' + $(this).html() + '">'+$(this).html()+'</a>');
});
+2
source

Try the following:

$('.phone').each(function(){
  $(this).html('<a name="???' + $(this).html() + '" href="tel:'+$(this).html()+'">'+$(this).html()+'</a>');
});
+1
source

More articles:


All Articles