RE: [jQuery] Effects/show callback in Internet Explorer

[Andreas Möller]

You've got errors in your presentation and, consequently, in your behaviour, as 
Jeffrey Zeldman would say, I reckon.

Here

             $("bio").click(function () {});

you are applying a selector which should select an element in your DOM with the 
tag "bio". However, no such element exists - neither in HTML nor XHTML. 

The same applies to

  $("clo").click(function () {});
  $("bio2").hide(400);

Then, in your CSS, you do the same, basically, you're applying the same CSS 
selector as above, as the argument to the JQuery select function, but an 
element with the tag "bio2" does not exist in HTML nor XHTML, and it probably 
never will.

  bio2 {}
  clo {}

However, you got it right with the class selector:
  
  .content {}

Then, in your HTML, you've got

  <bio>
  <a onClick="document.getElementById
('bio').style.color='#999999';>
                      bio
                     </a>
            </bio>

As said before, such an element does not exist in HTML nor XHTML, and it 
probably never will.

Same applies to

  <bio2 style="display: none" class="content">
    <clo><a onClick="document.getElementById
('bio').style.color='#000';">X</a>
    </clo>
</bio2>

You need to remove the invalid tags, otherwise your markup will not be valid. 
So, depending on whether you have one (id) or many (class) elements in the DOM 
to which effects should be applied, you need to fix your markup first with

  <div id="bio2"></div>

or 

<div class="bio2"></div>

, then you need to fix your CSS and your JQuery with appropriate selectors, 
i.e.,

  #bio2 {}

or

  .bio2 {}

and 

  $("#bio2")

or

  $(".bio2")

.

Then: remove inline CSS (no good), inline JS (btw, when you're using JQuery, 
you should let JQuery do the job, so replace

<a onClick="document.getElementById
('bio').style.color='#000';">X</a>

with something that works. Hey, you've already got it in your code, but darn, 
you've got the HTML and your CSS selectors wrong.


Best regards,

Andreas