How to remove unwanted character in HTML jQuery JavaScript

Question

I am trying to remove these "," from my HTML. I have tried .replace(",", ""), .join() and other methods but to no success.

Here is what it looks like in the console and on my page, notice the commas:

Here is my code:

        var featuresArray = jQuery(".Features").siblings().children("p").text().replace(",", "").split("\n");

        var boom =  featuresArray.map(function (item, index) {              
          return '<li>'+item+'</li>';
          });
        var features = boom;


        printWindow.document.write("<p class='product-attribute'>"+'Features: ' + '<ul class="product-attribute-details">' + features + "</ul></p>");

How can I remove these commas from my UL ?

Notice that the way you are using replace() will only replace the first instance of the search string. see w3schools.com/jsref/jsref_replace.asp — daddygames
– daddygames, Commented Aug 29, 2018 at 13:41
@YVH can you dump the content of featuresArray in the question? — Sudhansu Choudhary
– Sudhansu Choudhary, Commented Aug 29, 2018 at 13:41
If you need to remove all , characters, you need to use a regular expression: .replace(/,/g, ""). Also, if you call .join(), that will add , between all of the strings that are being joined - you're looking for .join("") — jmcgriz
– jmcgriz, Commented Aug 29, 2018 at 13:43
@daddygames Please don't use W3Schools as a reference. Their articles are often outdated and sometimes just plain wrong. MDN is far more comprehensive and accurate: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… — Rory McCrossan
– Rory McCrossan, Commented Aug 29, 2018 at 13:44

Rory McCrossan · Accepted Answer · 2018-08-29 13:42:32Z

3

The issue is because you're concatenating the array directly with the HTML string. As such, it will have toString() called on it. This is effectively doing .join(','). This is why the commas appear between the li elements, as you can see in this basic example:

var foo = ['a', 'b', 'c'];
console.log(foo.toString());

To fix this, manually call join('') on the array as you concatenate it:

printWindow.document.write('<p class="product-attribute">Features: <ul class="product-attribute-details">' + features.join('') + '</ul></p>');

Note that I made the quotes consistent in the above line, and also removed the unnecessary concatenation you were doing in a couple of places

answered Aug 29, 2018 at 13:42

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

YVH Over a year ago

Thank you ! This worked well, and I learned about the toString() behaviour!

Shilly · Accepted Answer · 2018-08-29 13:43:50Z

0

Use .join('') on the array before writing it into HTML.

Since arrays aren't strings, JS will call the default .toString() function of the array when concatenating it with a string, which causes the extra commas to appear in the HTML:

var ary = [ 1, 2, 3 ];

document.write( ary );
document.write('<br>');
document.write( ary.join( '' ) );

answered Aug 29, 2018 at 13:43

Shilly

8,5991 gold badge21 silver badges24 bronze badges

Collectives™ on Stack Overflow

How to remove unwanted character in HTML jQuery JavaScript

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related