Jquery: Replace values from one array to another

Question

I have 2 arrays that have the exact same number of keys. I would like to loop through the first array, then search <p> tags for any matching values. Then if a match is found, I would like to replace that matching value with the corresponding value from the 2nd array.

I have this for now:

var text_original = ["original_word1", "original_word2", "original_word3"];
var text_replaced = ["replaced_word1","replaced_word2","replaced_word3"];
var z;

for (z = 0; z <= text_original.length; ++z) {
  $("p").each(function(){
    var text=jQuery(this).html();
    $(this).html(text.replace(text_original,text_replaced));
  });
}

This is the general idea, I'm getting confused how to isolate the single values from the multiple array values. Thanks in advance for help!

Thanks, this is minimal, and I can't produce the code that I don't know how to write in the first place. If I gave everything, it would complicate worse. — Rob Myrick
– Rob Myrick, Commented Mar 13, 2018 at 19:25

Ele · Accepted Answer · 2018-03-13 19:42:16Z

Use the function indexOf and check for the found text.
Use the function text rather than the function html.

var text_original = ["original_word1", "original_word2", "original_word3"];
var text_replaced = ["replaced_word1", "replaced_word2", "replaced_word3"];

$('p').each(function() {
  var text = $(this).text();
  
  var index = text_original.indexOf(text);
  if (index > -1) $(this).text(text.replace(text_original[index], text_replaced[index]));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>original_word1</p>
<p>original_word2</p>
<p>Ele from SO</p>

Why `$.text()`?

The HTML <p> element represents a paragraph of text. Paragraphs are usually represented in visual media as blocks of text that are separated from adjacent blocks by vertical blank space and/or first-line indentation. Paragraphs are block-level elements.

The function $.text() will return the text without HTML tags.

Syscall · Accepted Answer · 2018-03-13 19:28:01Z

1

You missing echo before json_encode().
Your json_encode() should not be wrapped into quotes.
You have to use [z] to access to an element of an array.

Code :

var text_original = <?php echo json_encode($text_original); ?>;
var text_replaced = <?php echo json_encode($text_replaced); ?>;
var z;
for (z = 0; z <= text_original.length; ++z) {
    $("p").each(function(){
        var text=jQuery(this).html();
        $(this).html(text.replace(text_original[z],text_replaced[z]));
    });
}

answered Mar 13, 2018 at 19:28

Syscall

19.8k10 gold badges44 silver badges60 bronze badges

2 Comments

Rob Myrick Over a year ago

Hi @Syscall, I edited the original question to be slightly different. Nevermind the PHP code I originally placed. Sorry for that. Thanks!

Rob Myrick Over a year ago

Brilliant, and simple. Thank you so much!

Collectives™ on Stack Overflow

Jquery: Replace values from one array to another

2 Answers 2

Why `$.text()`?

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Why $.text()?

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related

Why `$.text()`?