Why does javascript .replace not work on this array key?

Question

here I am adding the text of each '. cmsCategories' div to item_array, but then .replace() won't work on the item_array keys. How can I fix this? (after this I'll write the new contents back into the div). Any help would be awesome!

http://jsfiddle.net/QKHJJ/1/

Javascript:

$(document).ready(function() {

var item_array=new Array();

$("[class=' cmsCategories']").each(function(i, obj) {
item_array.push(obj.innerHTML);
});

item_array[0].replace("icon_dog", "<img src='img/icon_dog.png' alt='icon_dog' />"); 
item_array[0].replace("icon_cat", "<img src='img/icon_cat.png' alt='icon_cat' />"); 

alert(item_array[0]);


});

HTML:

<ul class="cmsSmartListResults">
  <li>
    <div class=" cmsCategories">icon_cat, apple, icon_dog, pear, banana</div>
    <a href="" class=" cmsPageLink"></a>
    <div class=" cmsDescription"></div>
    <div class=" cmsFileSize"></div>
    <a class=" cmsMoreLink"></a>
</li>
  <li>
<div class=" cmsCategories">apple, icon_dog</div>
<a href="" class=" cmsPageLink"></a>
<div class=" cmsDescription"></div>
<div class=" cmsFileSize"></div>
<a class=" cmsMoreLink"></a>
</li>
  <li>
    <div class=" cmsCategories">pear, banana</div>
    <a href="" class=" cmsPageLink"></a>
    <div class=" cmsDescription"></div>
    <div class=" cmsFileSize"></div>
    <a class=" cmsMoreLink"></a>
</li>
</ul>

See stackoverflow.com/questions/1433212/replace-method-doesnt-work — Bergi
– Bergi, Commented May 21, 2014 at 22:29

Denys Séguret · Accepted Answer · 2012-09-19 15:11:49Z

6

1) The replace function doesn't change the string you pass (strings are immutable) : it returns a new one.

Do :

var newString = item_array[0].replace(...

or

item_array[0] = item_array[0].replace(...

2) After this operation, you must change the DOM again with $('someselector').html(item_array[0]);

The complete code you need is something like

$("[class=' cmsCategories']").each(function(i, obj) {
    var html = $(this).html();
    html = html.replace ...
    $(this).html(html);
});

edited Sep 19, 2012 at 15:11

answered Sep 19, 2012 at 15:06

Denys Séguret

384k90 gold badges813 silver badges780 bronze badges

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

3 Comments

chrisfrancis27 Over a year ago

Or assign the replace()d value back to the original variable.

Joe Over a year ago

Hi I was going to write back to the dom after - if you check the jsfiddle the key value isnt changed by .replace - am i missing something?

Joe Over a year ago

Wow I have definitely learned from using .each and $(this) here- seems quite powerful! thanks again!

Selvakumar Arumugam · Accepted Answer · 2012-09-19 15:08:17Z

3

The replace method does not modify the original value. You'd have to do something like:

item_array[0] = item_array[0]
     .replace("icon_dog", "<img src='img/icon_dog.png' alt='icon_dog' />");

edited Sep 19, 2012 at 15:08

Selvakumar Arumugam

79.9k15 gold badges123 silver badges139 bronze badges

answered Sep 19, 2012 at 15:07

chinabuffet

5,62810 gold badges43 silver badges70 bronze badges

Comments

Selvakumar Arumugam · Accepted Answer · 2012-09-19 15:08:00Z

2

You should do

item_array[0] = 
    item_array[0].replace("icon_dog", "<img src='img/icon_dog.png' alt='icon_dog' />")

answered Sep 19, 2012 at 15:08

Selvakumar Arumugam

79.9k15 gold badges123 silver badges139 bronze badges

Comments

JoeFletch · Accepted Answer · 2012-09-19 15:08:40Z

2

I think that your replace statement is incorrect. Try this.

item_array[0] = item_array[0].replace("icon_dog", "<img src='img/icon_dog.png' alt='icon_dog' />"); 
item_array[0] = item_array[0].replace("icon_cat", "<img src='img/icon_cat.png' alt='icon_cat' />");

jsFiddle

answered Sep 19, 2012 at 15:08

JoeFletch

3,9991 gold badge30 silver badges39 bronze badges

Comments

Chris Dixon · Accepted Answer · 2012-09-19 15:09:17Z

1

Updated your jsFiddle, you forgot the array = array.replace.

http://jsfiddle.net/QKHJJ/3/

answered Sep 19, 2012 at 15:09

Chris Dixon

9,1777 gold badges38 silver badges69 bronze badges

Collectives™ on Stack Overflow

Why does javascript .replace not work on this array key?

5 Answers 5

3 Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

3 Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related