user6733315 user6733315 - 3 months ago 9
jQuery Question

Why hide() is behaving differently?

I want to remove the element by clicking on them(one by one). I almost done .but little problem.

I write this code. this work fine .But this works only for

slide()
and
css()
.these two example make effect only to the element on which i click.
TRY it

$("#button").click(function(){
var k = $("<p></p>").text("paragraph");
$("#content").append(k);
});

$("#content").on("click","*",function(){
$(this).slideToggle();
});


https://jsfiddle.net/k61Lb684/

https://jsfiddle.net/k61Lb684/1/

But the problem is i want to remove the element
But when i try to
remove()
or
hide()
with same method. it only hides the bottom element.

https://jsfiddle.net/k61Lb684/2/

https://jsfiddle.net/k61Lb684/3/

Can someone Explain why this different behaviour for
hide()
and
remove()
. and a better solution for my problem. Please help.

Answer

hide and remove workes the same way. But both don't have a animation time by default. So both are so fast, that it visible seems, that the last row would be removed. But the truth is, that the bottom elements slide up to the new empty space in the list.

You can see the correct behavior when giving hide a time for it's animation:

$(this).hide(500);

Working example.

Comments