I am trying to convert plain text email addresses into clickable mailto links inside of a table.
I have the following function that is converting found links into mailto links, but it only seems to work for the first found link. Any subsequent links (2nd, 3rd occurrence etc.) remain as plain text links. I can't seem to figure out what I might be doing wrong. Any help would be much appreciated!
The code:
HTML
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<div class='filter-email-box'>
<div>This is a sample text which contains john@gmail.com </div>
<div>This text contains two emails adam@example.com and paul@example.com </div>
</div>
Javascript
$(".filter-email-box div").filter(function(){
var html = $(this).html();
var emailPattern = /[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}/;
var matched_str = $(this).html().match(emailPattern);
if(matched_str){
$(this).html(html.replace(emailPattern,"<a href='mailto:"+matched_str+"'>"+matched_str+"</a>"));
return $(this)
}
})
Heres the fiddle I've setup: http://jsfiddle.net/z6LF5/