CODEWITHSUNDEEP
javascripthtmlajax
Matt
Matt

Reputation: 186

Fetching data from API and displaying as Name and website link

I am trying to fetch data from the API and display them in format Name + clickable website link. I was able to display data but the link is represented as text rather than hyperlink.

There is my Ajax script: 

$(function() {
        $.ajax({
            url: "url",
            type: "get",
            dataType: "json",
            success: function(data) {
             console.log(data.name);


                for (i = 0; data.length; i++)  {
                    name = data[i].name;
                    web_pages = data[i].web_pages;


                    var link = document.createElement('a');
                    link.setAttribute('href', web_pages);
                    link.innerHTML = web_pages;


                        var paragraph = $("<p />", {
                          text: name + " " + link
                        });

                    $("#display-resources").append(paragraph);
                }
            }
        });
    });

Upvotes: 0

Views: 387

Answers (1)

Jaeeun Lee
Jaeeun Lee

Reputation: 3196

It's because you're inserting the link as text (string). Try this instead

var paragraph = $("<p />", { text: name + " " }).append(link)

Upvotes: 2

Related Questions