Question

I am setting up a page that has multiple links to different documents. Since the names of the links match the documents they are linked to, I thought I would write a script that takes the inner html of anything underlined and generates a link tag around it and inputs each particular link name in the link.

The script I wrote runs fine except it only runs once and updates all links with one identical link for each. Is there a way I can make it take each instance and change them individually?

Sorry if I’ve butchered my explaination!

Here is my current code:

<u>Link1</u>
<u>Link2</u>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script>
innerU = $("u").html();
$("u").html("<a href=mywebsite.com/" + innerU + ".pdf>" + innerU + "</a>");
</script>

Answer 1

You can use jQuery’s each() to apply the transformation you want to each <u> element in your page. Something like this:

$("u").each(function() {
    var innerU = $(this).html();
    $(this).html("<a href='mywebsite.com/" + innerU + ".pdf'>" + innerU + "</a>");
});

EDIT : added quote around href value to produce valid HTML. Thanks Kolink for noticing.