Get content of loaded SVG file

Question

I have made function that will load to specific div svg file from url:

function load_vector(divId, vector_url) {
    var div = $(divId);

    div.load(vector_url);

    console.log(div.find('svg').html());
}

I call this function like this:

load_vector("#myDiv", "/path/to/vector/file.svg");

It successfully loads svg file to this div and now I have it as html in my page.

However I can't get contents of this svg file

console.log(div.find('svg').html());

This returns undefined.

Whad did I miss?

Answer 1

Need to wait until the load process is complete (it is async). Wrap your console.log inside a callback function. Something like:

div.load(vector_url, function() {
    console.log(div.find('svg').html());
});