How to correctly display Arabic letters in android using a telephone plug?

Question

I am making an Android application in phonegap, it contains Arabic and English text. I also use the Arabic font, and changing the fonts works fine, the Arabic text looks fine in the web browser, but the HTC One V Android device that I use for testing does not display as it should, the file is saved in UTF -eight. Can someone tell me how I can correctly display Arabic text in a phone stumble. thanks

بسم الل َّ ه الر َّ حم َٰ ن الر َّ حيم

<li class="arabic">ٱللَّهُ لَآ إِلَـٰهَ إِلَّا هُوَ ٱلۡحَىُّ ٱلۡقَيُّومُۚ لَا تَأۡخُذُهُ ۥ سِنَةٌ۬ وَلَا نَوۡمٌ۬ۚ لَّهُ ۥ مَا فِى ٱلسَّمَـٰوَٲتِ وَمَا فِى ٱلۡأَرۡضِۗ مَن ذَا ٱلَّذِى يَشۡفَعُ عِندَهُ ۥۤ إِلَّا بِإِذۡنِهِۦۚ يَعۡلَمُ مَا بَيۡنَ أَيۡدِيهِمۡ وَمَا خَلۡفَهُمۡۖ وَلَا يُحِيطُونَ بِشَىۡءٍ۬ مِنْ عِلۡمِهِۦۤ إِلَّا بِمَا شَآءَۚ وَسِعَ كُرۡسِيُّهُ ٱلسَّمَـٰوَٲتِ وَٱلۡأَرۡضَۖ وَلَا يَـُٔودُهُ ۥ حِفۡظُهُمَاۚ وَهُوَ ٱلۡعَلِىُّ ٱلۡعَظِيمُ <span class="ui-li-count">١</span></li> </ul> and here is my css for arabic font /*custom arabic fornt*/ @font-face { font-family: "customfont"; src: url(../../../fonts/ar-Othmani.ttf) format("truetype"); } .arabic { margin: 0; -webkit-touch-callout: none; /*prevent callout to copy image, etc when tap to hold*/ -webkit-text-size-adjust: none; /* prevent webkit from resizing text to fit */ -webkit-user-select: none; /* prevent copy paste, to allow, change 'none' to 'text' */ font-family: "customfont" !important; font-size:25px; font-weight: normal !important; }