JSFiddle - React, Tailwind, and code Playground

HTML

<div style='color: #c2c2c2'>
		text number 1
		<span>text number #31*111*</span>
		<div>
			text number 3
			<b>text number 4</b>
			<a href='#page2'>text number 5</a>
		</div>
	</div>

JavaScript

$(document).ready(function(){
    persian={0:'۰',1:'۱',2:'۲',3:'۳',4:'۴',5:'۵',6:'۶',7:'۷',8:'۸',9:'۹'};
	function traverse(el){
		if(el.nodeType==3){
			var list=el.data.match(/[0-9]/g);
			if(list!=null && list.length!=0){
				for(var i=0;i<list.length;i++)
					el.data=el.data.replace(list[i],persian[list[i]]);
			}
		}
		for(var i=0;i<el.childNodes.length;i++){
			traverse(el.childNodes[i]);
		}
	}
    traverse(document.body);
});