Same browser version, 2 different javascript handlings

Problem solved: I removed the first function as it wasn't needed anyways, and now it all works in all browsers. Thanks for the posts though!

---

My issue here is that I have a javascript which on one server runs perfectly with no issues what-so-ever in IE. But on another server gives me 2 errors in IE.

1. It claims that my offset().top is either Null or not an object.
2. My fade in and out effect doesn't even become active.

Then I have another HUGE issue, which is that in FireFox NON of it all works.

OPS: This is a webpart, so additional javascripts running on the site might could intervene with the javascript I am trying to execute here. But I'm not sure.

I've tested this webpart in IE 8.0.7600.16385, on both servers.

Script:

<script type="text/javascript" 
src="/_layouts/Progressive/Javascripts/jquery-1.4.3.js"></script>

<script type="text/javascript">
(function($) {
    $.fn.goTo = function() {
        // This is where IE on the second 开发者_StackOverflowserver claims the error to be.
        $('html, body').animate({scrollTop: $(this).offset().top + 'px'}, 'fast');
        return this;
    }
})(jQuery);

function showParagraphs(sender) {
    var id = sender.getAttribute('href');
    if ($('#<%=paragraph.ClientID%>').hasClass("readable")) {
        $('#<%=paragraph.ClientID%>').removeClass("readable");
        highlightSelected(id);
    }
    else {
        $('#<%=paragraph.ClientID%>').addClass("readable");
        rmvClass(id);
    }
};

function highlightSelected(id) {
    $(id).goTo();
    $(id).addClass("reading");
    // This part is what isn't activated on the second server.
    $('.reading').fadeOut(400).fadeIn(400).fadeOut(400).fadeIn(400);
    // .reading only adds a gray background to the DIV.
};

function rmvClass(id) {
    $('div').each(function() {
        if ($(this).hasClass("reading")) {
            $(this).removeClass("reading");
        }
    });
}

function toTop() {
    $('div').each(function() {
        $(this).removeClass("reading");
    });
    $('#<%=paragraph.ClientID%>').addClass("readable");
}

$(document).ready(function() {
    $('#<%=q.ClientID%>').find('dd').hide().end().find('dt').click(function() {
        $(this).next().slideToggle("fast");
    });

    $("#<%=q.ClientID%> dt").click(function() {
        if ($(this).hasClass("selected")) {
            $(this).removeClass("selected");
        }
        else {
            $(this).addClass("selected");
        }
    });
});
</script>

Any thoughts or suggestions?

---

When

$(id)

returns an empty jQuery object, then ".offset()" will return null. You're calling that "highlightSelected" code with the "href" value from something, so perhaps what you think to be an "id" value that corresponds to something on the page, well it really doesn't. It's hard to know for sure, however, because you did not post any of the relevant HTML, nor did you even show where "showParagraphs()" is called!