Issue with JQuery Each function

Question

I have a jquery function to hide email ids on the webpage to avoid spambots. I am trying to replace all the span tags with class 'mailme' to valid email ids with the help of this function. The code was working for 1 span tag but since its changed to multiple spans with the help of each method, its not working.

Html

<span class="mailme">myemail at mydomain dot com</span>

jQuery

$('span.mailme').each(function(){
var spt = "#" + $(this).attr("id");
var at = / at /;
var dot = / dot /g;
var addr = $(spt).text().replace(at,"@").replace(dot,".");
$(spt).after('<a href="mailto:'+addr+'" title="Send an email">'+ addr +'</a>')
.hover(function(){window.status="Send a letter!";}, function(){window.status="";});
$(spt).remove();
});

You are trying to get an ID from an element which it hasn't one. — profanis
– profanis, Commented Feb 3, 2011 at 17:02

Šime Vidas · Accepted Answer · 2011-02-03 18:14:25Z

3

Live demo: http://jsfiddle.net/g7Szt/2/

$('span.mailme').each(function () {
    var addr = $(this).text().replace(/ at /, "@").replace(/ dot /g, "."),
        s = '<a href="mailto:' + addr + '" title="Send an email">' + addr + '</a>',
        link = $(s);

    link.hover(function () {
        window.status = "Send a letter!";
    }, function () {
        window.status = "";
    });

    $(this).replaceWith(link);
});

<head>
    ...
    <script>
        $(function() {
            // place all jQuery code here
        });
    </script>
    ...
</head>

edited Feb 3, 2011 at 18:14

answered Feb 3, 2011 at 17:03

Šime Vidas

187k66 gold badges290 silver badges392 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Piyush Over a year ago

have corrected the quotes, thanks for pointing that out. But its still not working.

Piyush Over a year ago

This is really strange. Since I am new to jQuery, I think I am doing something wrong with the placement of the code. I tried the code and it is working in jsFiddle but not in my HTML. Currently I have placed the code between script tags under head section. No DOM function or onload is being used. Can you tell me what I am missing out?

Šime Vidas Over a year ago

@Piyush If the code is in the HEAD element, you have to wrap the code aournd the ready handler. I'll update my answer to explain how to do it.

Šime Vidas Over a year ago

@Piyush Note that since the code won't execute until the whole HTML document is parsed, it is irrelevant if the SCRIPT is in the HEAD or BODY. For instance, I put my SCRIPT elements at the very bottom of the page.

Collectives™ on Stack Overflow

Issue with JQuery Each function

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related