Try this:

$('.sampleClass span').replaceWith(function() {
    var url = $.trim($(this).text());
    return '<a href="' + url + '" target="_blank">' + url + '</a>';
});

There's no need for each, since replaceWith 11 can iterate through multiple elements and 10 can take a function as a parameter.

Looking 9 at your sample HTML, I see that it is only 8 the first <td> that contains a URL. If there 7 is indeed only one, you can add first() to the 6 selector chain, like this:

$('.sampleClass span').first().replaceWith( /* ... */ );

If it is rather 5 the entire column that contains links, than you'll 4 want to operate on every other match. Do 3 this by appending :even to your selector, like 2 this:

$('.sampleClass span:even').first().replaceWith( /* ... */ );

(Yes, :even and not :odd to select the 1st, 3rd, &c. elements, because 1 of 0-based indexing.)

Put the span an id and then you can do something 2 like

var linkText = $("#yourspanid").text();

$("<a/>").attr({"href": linkText, "target": "_blank"}).text(linkText).appendTo("body");
$("#yourspanid").remove();

Changing according to your edit

var elems = $("span.myClass > span");
elems.each(function(){
    var linkText= $(this).text();
    $("<a/>").attr({"href": linkText, "target": "_blank"}).text(linkText).appendTo("body");
});
elems.remove();

See a 1 working demo

You need to have some form of identification 5 in order to do the conversion from node 4 A to node B. I would suggest something along 3 the following lines:

The JQuery code:

<script type="text/javascript">

    $('.convertableIdentifier').each(function(i, el) {

        // grab the url and the link text
        var url = $(el).html();

        // create a new node with query by decorating a
        // empty a tag
        var newNode = $('<a></a>').attr('href', url).attr('target', '_blank').html(url);

        // replace the current node with our new node
        $(el).replaceWith(newNode);

    });

</script>

The 2 HTML:

<span class="convertableIdentifier">http://www.google.com</span>
<span class="convertableIdentifier">http://www.youtube.com</span>
<span class="convertableIdentifier">http://www.facebook.com</span>

The above code is not tested, but should 1 hopefully lead you in the right direction.

Use jQuery.

give the span an id:

<span id="linkChange">http://domain.com</span>

jQuery code:

var href = jQuery('#linkChange').html();
var link = "<a href='"+href+"' target='_blank'>"+href+"</a>";

jQuery('#linkChange').replaceWith(link);

0

Perhaps something like this: (no need to 6 know ids/classes) useing jquerys for-each 5 loop and specificly target spans inside 4 of tds

$(document).ready(function(){ $('td span').each(function(){ $(this).text("" + $(this).text() + ""); }); });

EDIT:this code works much better:

<script type="text/javascript">
    $(document).ready(function(){
        $('td span').each(function(){
            $(this).html("<a href='" + $(this).html() + "' />" + 
                $(this).html() + "</a>");
        });
    });
</script>

The origional used the .text() function of 3 jquery which html escaped the <> characters, unintentionally 2 addin > < into the dom, while .html actually 1 outputs the correct tags