Question

I have a cms that is returning a list like so:

1 This is the first list item 100 people have seen it

2 This is the second list item 29 people have seen it

I need to wrap the first integer in a span to style the list items (altering the output rendered is not an option), to achieve the following:

<span>2</span> This is the second list item 29 people have seen it

I currently have:

return v.replace(/(\d+)/g, '<span>$1</span>');

But that is replacing all integers. I have tried the following with no luck:

return v.replace(/(\^d+)/g, '<span>$1</span>');

What is the best way I can achieve this?

Answer 1

g means global, you only need replace the first match then you don’t need to use g modifier.

return v.replace(/(\d+)/, '<span>$1</span>');

And your second piece of code put \ in wrong place.

return v.replace(/^(\d+)/, '<span>$1</span>');