Programmatically generate image source url

How can I generate the image source via a JavaScript function?

I am using JQuery mobile to create a list with a thumbnail:

$("#nav").append(

            '<li>' + '<a>' + '<img src=""/>' +
                '<h3>' + surName + ', ' + firstName + ' (' + any + 
                ')' + '</h3>开发者_运维知识库;' + '<p>' + another + '</p>' +
                '</a>' + '</li>'
        );
        })
        $("#nav").listview("refresh");

The image source is changing each time I iterate through my list-creation, this means, the url for the image is created on the fly via:

function getPicUrl(empID) {

    var url = "url/loadEmployees/"
    url = url + empID;
    url = url + "/images/thumb";

    return url;

}

Which means the image source must be somehow added ... I don't know how to do this.

Something like <img src="getPicUrl(variable)"> ... is this possible ?

add your function to be called where the src is:

$("#nav").append(

        '<li>' + '<a>' + '<img src="' + getPicUrl(idVariable) + '"/>' +
            '<h3>' + surName + ', ' + firstName + ' (' + any + 
            ')' + '</h3>' + '<p>' + another + '</p>' +
            '</a>' + '</li>'
    );
    })
    $("#nav").listview("refresh");

You should just be able to do $('img').attr('src',getPicUrl(empID));