Question

I know that the question is so simple but I can’t figured it out. I have the following html ;

<div class="prev_comments">                     
    <div class="commentRow">
        <div class="box1"></div>
        <h2>
            <span> ..some text..  </span> ..some text again..
        </h2>                     
    </div>                  
</div>
<div class="new_comment">
    <input class="writecomment" type="text" placeholder="Write a comment">
</div>

I have a .writecomment event in jquery. So, in my jquery, $(this) stands for writecomment field.

I need to append a new <div class="commentRow"> ... </div>. In my jquery, I have the following code ;

$(this).closest('.new_comment').prev('.prev_comments').append($comment_element).hide().fadeIn('slow');

It doesn’t work at all. $comment_element is just the necessary html to append for <div class="commentRow"> ... </div>

Any ideas why it doesn’t work ? Any solutions ?

Based on comments, here is the link of jsFiddle;

http://jsfiddle.net/aacanakin/fv3hN/

Answer 1

Here is a quick fiddle.

Is this what you are trying to accomplish? I bound your add comment code to the blur of the text box for now.

EDIT:

This fiddle is the one I updated, but created by the poster.

http://jsfiddle.net/PNJrc/1/