I'm trying to make 2 things fade in, one when one link is selected, the other when the other link is selected?

Right, I have 4 divs, I want 1 and 3 to fade in when a link is clicked, and 2 and 4 to fade in when the other button is clicked. I'm using JQuery. Here's what I've got so far:

<div id="video selector" style="float: right; width: 250px; background-color:#f3f3f3; height: 210px; margin-bottom:13px;">
<a href="#">
  <script>
     $(document.body).click(function () { 
         $("#1").fadeIn("slow"); 
         $("#3").fadeIn("slow"); 
         $("#2").hide();  
         $("#4").hide();
      });
  </script>
  <img src="img/electronic recycling play.png" style="width:220px; padding-left:15px; padding-top:12px; padding-bottom:9px; cursor:pointer;" />
  </a>
  <center>Electronic Recycling</font></center>
  </div>

This one is loading divs 1 and 3.

<div id="video selector2" style="float: right; width: 250px; background-color:#f3f3f3; height: 210px;">
 <a href="#">
   <script>
         $(document.body).click(function () { 
            $("#2").fadeIn("slow"); 
            $("#4").fadeIn("slow"); 
            $("#1").hide();  
            $("#3").hide();
         });
    </script>
    <img src="img/battery recycling play.png" style="width:220px; padding-left:15px; padding-top:12px; padding-bottom:9开发者_C百科px; cursor:pointer;" />
    </a><center>Battery Recycling</font></center>
  </div>

This one is loading divs 2 and 4.

The problem is they both load the same divs (2 and 4), and the video doesn't switch, just reloads the same one, wither button you press... any ideas?

---

Add an id to your a tag like this:

  <a href="#" id="firstlink"> ... </a>

Then in the document ready function add the click event handler like this:

  <script>
 $(document).ready(function () {
     $("#firstlink").click(function(){ 
     $("#1").fadeIn("slow"); 
     $("#3").fadeIn("slow"); 
     $("#2").hide();  
     $("#4").hide();
   });
  });
</script>

The above code can go in the head of your page rather than in the content of the a tag. It adds the event handler such that when the a tag with id firstlink is clicked it executes the function. A similar function can be done for the next link.