jquery replace string in anchor by using regex

Question

In class="listing" all li a with string "-p." should be replaced to " / p. " eg. "1r-p.1_1" should be converted to "1r / p. 1_1".

current situation:

<ul class="listing">
  <li><a href="#">1r-p.1_1</a></li>
  <li><a href="#">1v-p.1_2</a></li>
  <li><a href="#">2r-p.1_3</a></li>
</ul>

the goal:

<ul class="listing">
  <li><a href="#">1r / p. 1_1</a></li>
  <li><a href="#">1v / p. 1_2</a></li>
  <li><a href="#">2r / p. 1_3</a></li>
</ul>

I tried with the following snippet but it doesn't affect anything.

$(document).ready(function() {
  $("ul.listing a").text().replace(/-p\./, ' / p. ');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="listing">
  <li><a href="#">1r-p.1_1</a></li>
  <li><a href="#">1v-p.1_2</a></li>
  <li><a href="#">2r-p.1_3</a></li>
</ul>

replace() does not update the source. You have to store the changed string back into the place it should go. — Taplar
– Taplar, Commented Mar 15, 2018 at 14:46
You should be replacing the text content, there is no src attribute. — Peter B
– Peter B, Commented Mar 15, 2018 at 14:46
Possible duplicate of How do I replace text inside a div element? or Jquery: Find Text and replace — Heretic Monkey
– Heretic Monkey, Commented Mar 15, 2018 at 14:50

Asons · Accepted Answer · 2018-03-15 14:48:44Z

4

You want to use the .text() function on the anchors like so:

$(document).ready(function() {
  $("ul.listing a").text(function(i,txt) {
    return txt.replace(/-p\./, ' / p. ');
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="listing">
  <li><a href="#">1r-p.1_1</a></li>
  <li><a href="#">1v-p.1_2</a></li>
  <li><a href="#">2r-p.1_3</a></li>
</ul>

edited Mar 15, 2018 at 14:48

Asons

87.7k12 gold badges119 silver badges175 bronze badges

answered Mar 15, 2018 at 14:46

j08691

208k33 gold badges269 silver badges281 bronze badges

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

3 Comments

Asons Over a year ago

Pretty sure down voter meant that with text(), and if their will be html inside the anchor, it get stripped out, with html() it will be preserved.

Trinity76 Over a year ago

what does the argument "i" in the function text(function(i,txt) do exactly? It's not used in the function body. can someone elaborate?

j08691 Over a year ago

@Trinity76 if you read the docs about the function you'll see that the first argument passed to the function is the index of the element being iterated on. "function Type: Function( Integer index, String text ) => String"

Collectives™ on Stack Overflow

jquery replace string in anchor by using regex

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related