JQuery - Dynamic Text Trimming - Iphone issue
<p>We are implementing a mobile version of a clients website.  A store page has a long list of store information with links to further info an example of one store HTML block is as follows - </p>

<pre><code> &lt;div class="overlayContent"&gt;
&lt;h2&gt;Bagot Opticians&lt;/h2&gt;
&lt;div&gt;
10 Library Road
&lt;br&gt;
Kendal, LA9 4QB
&lt;br&gt;
Tel: 01539 721619
&lt;/div&gt;
&lt;a href="store-directory/bagot-opticians.aspx"&gt;more about S., C. &amp;amp; T. Bagot&lt;/a&gt;
&lt;/div&gt;
</code></pre>

<p>I have used the following code to loop through the stores and remove the 'more about part of the text: </p>

<pre><code> $(document).ready(function() {



$('.jsGrid ul li').each(function(index) {
     var anchortext =($('.overlayContent a', this).text());
     alert(anchortext)

        $('.overlayContent a', this).html(anchortext.substring(10, anchortext.length));

});
});
</code></pre>

<p>it works fine on every device apart from an iphone - which for some reason picks up the tel number as  part of the a target!?  Can anyone offer a different approach or any reason for this issue?</p>

<p>Cheers
Paul</p>
