How to change background image of div?

Question

This is my code:

<div style = {{ backgroundImage: "url(img.jpg)" }} className="card">
    <h3>{character.name}</h3>
</div>

This code doesnt work. Output just white color

Answer 1

Try this:

<div style={{ backgroundImage: `url(${require("img.jpg")})` }} className="card">
    <h3>{character.name}</h3>
</div>

Answer 2

Providing you the generic solution which will work in any javascript frameworks.

HTML

<div id="parentDiv" className="card">
    <h3>XYZ </h3>
</div>

JS

document.getElementByID('parentDiv').style.backgroundImage = "url('your_image_name.png')";