JQuery expands all divs on page

One div works fine, however when using multiple divs they 开发者_C百科all get expanded simultaneously.

Here 1x http://jsfiddle.net/uPzXh/1/

Here 2x http://jsfiddle.net/uPzXh/

How about:

jQuery(document).ready(function() {
   jQuery(".lol").hide();
   jQuery(".lollink").click(function() {
      jQuery(this).prev().slideToggle(500);
      jQuery(this,".new").hide();
  });
});

BTW div in a is not allowed according to the spec.

In the second example you have a div with the same class name twice. So this line of code:

jQuery(".lol").slideToggle(500);

is doing what you tell it to do .. open all elements with a class name of lol. Changing the class of the second div to lol2 would fix this.

I think you need to use $(this) inside the click function rather than $('.lol')

demo

I think what you are looking for is to expand one div when one link is clicked (not expand both, one after the other). If that's right, you can do something like this:

jQuery(".lollink").click(function() {
    jQuery(this).hide().parent().find(".lol").slideToggle(500);
});

This hides the clicked element, gets the parent element, finds the descendant of that element with class .lol and toggles the slide on that.

See an updated fiddle here.