Insert javascript variable as background image source

Question

I have a variable that I can display on the page by using the following <script>document.write(image)</script>

I can copy the result to the browser and it displays the file I require.

What I want to do is to take that variable and use it to specify the src of my background image

`<p style="background-image: url(**image**);">`

I know that this is probably simple to you guys, but I have spent the whole day and am losing a lot of hair over this one. Thanks for your time....

Answer 1

If the element is selectable :

<p id="paragraph">Some text</p>

You can change the style with javascript:

document.getElementById('paragraph').style.background = 'url('+image+')';

if you're creating the paragraph you can do:

var p = document.createElement('p');
p.style.background = 'url('+image+')';

Answer 2

Give the <p> element an id:

<p id="myPElement">

Manipulate it in the dom...

document.getElementById('myPElement').style.backgroundImage = 'url(' + image + ')';

... or with jquery:

$('#myPElement').css('background-image', 'url(' + image + ')');