LA_
LA_

Reputation: 20409

How to add div as hidden with jQuery?

I update the html with ajax call. I need to add element as hidden and then apply animation:

$.ajax({
    success: function (data, textStatus) {
        $(".comments").prepend(data);
        $(".comments .comment-frame:first").slideDown("slow"); // it doesn't work, since element is visible

Data added:

<div class="comment-frame">
...
</div>

I can not modify css to make class comment-frame hidden, since I already have other elements on the page with the same class, which should remain visible. So, somehow I should add that data as hidden. How can I do it?

Upvotes: 3

Views: 6813

Answers (2)

simshaun
simshaun

Reputation: 21466

You can make a jQuery object out of data and .hide() it before .prepend()ing it to $(".comments").

$.ajax({
    success: function (data, textStatus) {
        var $data = $(data).hide();
        $(".comments").prepend($data);
        $(".comments .comment-frame:first").slideDown("slow");

Upvotes: 8

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114377

Make a wrapper that's hidden when you insert it:

$(".comments").prepend('<div style="display:none">'+data+'</div>');

Upvotes: 6

Related Questions