Changing text to link with javascript

Question

My goal is to change text in span .name into element with link-

  <div class="input-wrap">
      <span class="name">favorite 1</span>
  </div>

How can I use JS to add link to this element so as it looks like that:

 <div class="input-wrap">
      <span class="name"><a href="/specyficwebsite.html">favourite 1</a></span>
  </div>

codingrose · Accepted Answer · 2013-11-13 05:53:19Z

3

.wrapInner() wraps element around passed value.

Try this:

$(".name").wrapInner("<a href='/specyficwebsite.html'></a>");

Fiddle here.

answered Nov 13, 2013 at 5:53

codingrose

15.7k11 gold badges41 silver badges58 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

acdcjunior · Accepted Answer · 2013-11-13 05:50:24Z

2

You could:

$('span.name').html(function () {
    return $('<a>').attr('href', '/specyficwebsite.html').text($(this).text());
});

See demo jsFiddle here.

Generated HTML:

<span class="name"><a href="/specyficwebsite.html">favourite 1</a></span>

answered Nov 13, 2013 at 5:50

acdcjunior

136k37 gold badges341 silver badges312 bronze badges

Comments

Greenhorn · Accepted Answer · 2013-11-13 05:53:13Z

1

You can do this way:

$(".name").html(function(){
$(this).wrap("<a href='/specyficwebsite.html'></a>")
})

Demo Fiddle

answered Nov 13, 2013 at 5:53

Greenhorn

1,70011 silver badges12 bronze badges

Comments

rajesh kakawat · Accepted Answer · 2013-11-13 05:54:01Z

1

try something like this

        $(function(){
            var link = '<a href="/specyficwebsite.html">'+$('.name').text()+'</a>';
            $('.name').html(link);
        })

answered Nov 13, 2013 at 5:54

rajesh kakawat

10.9k1 gold badge24 silver badges40 bronze badges

Comments

GautamD31 · Accepted Answer · 2013-11-13 05:55:37Z

1

Try with .wrapInner() like

$(".name").wrapInner( '<a href="/specyficwebsite.html"></a>' );

See this FIDDLE You can also try like

var txt = $('.name').text();
$('.name').html('<a href="/specyficwebsite.html">' + txt + '</a>');

Or directly

$('.name').html('<a href="/specyficwebsite.html">' + $('.name').text() + '</a>');

Try this FIDDLE

edited Nov 13, 2013 at 5:55

answered Nov 13, 2013 at 5:49

GautamD31

28.8k10 gold badges66 silver badges86 bronze badges

1 Comment

GautamD31 Over a year ago

Can tell me the reason to down it..??

Vond Ritz · Accepted Answer · 2013-11-13 05:58:07Z

0

Heres the FIDDLE

var $name = $(".name");
var txt = $name.text();
$name.html('<a href="/specyficwebsite.html">' + txt + '</a>');

edited Nov 13, 2013 at 5:58

answered Nov 13, 2013 at 5:51

Vond Ritz

2,01215 silver badges15 bronze badges

Collectives™ on Stack Overflow

Changing text to link with javascript

6 Answers 6

Comments

Comments

Comments

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

Comments

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related