How to replace underscores with spaces?

I have an array with objects inside of it, a few of the objects contain an underscore in the string.

Example:

{"name": "My_name"}

But I'm calling the name function in multiple places, one such place is in an image tag where the underscore is necessary, using JavaScript I want to select a certain div with the name in it and replace the underscore with space.

Example:

<div>
 <div class="name">
  My_name
 </div>
 <img src="My_name.jpg"/>
</div>

In the div.name I want it to say My name instead of My_name.

Solution 1:

You can replace all underscores in a string with a space like so:

str.replace(/_/g, ' ');

So just do that before the content is put in. If you need to perform the replacement afterwards, loop using each:

$('.name').each(function () {
    this.textContent = this.textContent.replace(/_/g, ' ');
});

Solution 2:

ES2021 introduced the nifty replaceAll()-function which means it can be written as:

str.replaceAll('_', ' ')

If you want to do multiple elements just loop over them and use forEach():

const elements = document.querySelectorAll('.name')   
elements.forEach(e => e.innerText = e.innerText.replaceAll('_', ' '))