JSFiddle - React, Tailwind, and code Playground
HTML
<div class="header">
<h1>Time is Money</h1>
<p>Find out how much time it will take you to buy something!</p>
</div>
<div class="test">$12</div>
<ul>
<li>$12</li>
<li>$14.93</li>
<li>$2</li>
<li>$dollars</li>
<li>14.99</li>
<li>$12,001,121.13111</li>
</ul>
CSS
body {
font-family: Helvetica, Arial, sans-serif;
}
h1 {
font-size: 30px;
color: green;
}
p {
font-size: 18px;
}
JavaScript
var pageText = document.body.innerHTML;
document.body.innerHTML = pageText.replace(/\$([\d,]+(?:\.\d+)?)/g,
function (string, c1) {
//If there are commas, get rid of them and record they were there
var comma = c1.indexOf(',') != -1;
c1 = c1.replace(/,/g, '');
//Parse and double
var value = '' + (parseFloat(c1) * 2);
//Reinsert commas if they were there before
if (comma) {
var split = value.split(".");
value = split[0].replace(/(\d)(?=(\d{3})+$)/g, "$1,");
if(split.length > 1)
value += "."+split[1];
}
//Return with dollar sign prepended
return '$' + value;
});