Question

I’m developing a wall and I’m having trouble with the following code. As you can tell from the image below that new comments are added to the bottom. But I need it to be appended but appended before the commentBox. I thought maybe the .before() would come in handy but I couldn’t figure out how to get it to work. Any ideas on how to get this to work?

jQuery:

e.closest('.status-border-bottom-box1').find('.commentsList').append(html); // needs to insert before commentBox

Html:

        <div class="commentsList" style="width: 104%">
        <div id="commentLikeListing" style="width: 100%; display: none"></div>
<?php   $query1 = $this->db->query("SELECT * FROM wallpostcomments wp INNER JOIN users u ON u.userid = wp.userid WHERE wallPostId = '{$row->idwallPosts}' ORDER BY wp.idwallPostComments ASC");
        foreach($query1->result() as $row1)
            if ($query->num_rows() > 0) { ?>
        <div id="likeList" style="display: none; width: 95%"></div>
        <div id="commentsList" style="width: 96%">
        <table cellpadding="0" cellspacing="0" style="width: 408px" class="style1 commentStyle">
        <tr>
        <td valign="top" style="width: 10px">
        <img style="padding: 3px" id="defaultImg a0" src="<?=base_url().$row1->defaultImgURI?>" align="left" width="25px" height="25px" />
        &nbsp;</td>
        <td valign="top" style="width: 319px">
        <a class="font1 link-font1"><b><?=$row1->firstname.' '.$row1->lastname?> </b></a><?=$row1->entryData.'<br>'.date('m/d/Y h:ia ', strtotime($row1->DateTimeCreated))?></a>
        </td>
    </tr>
</table>
        </div>
        <?php } ?>
        <input placeholder="Write a comment..." id="commentBox-<?php echo $row->idwallPosts; ?>" class="textbox1" style="width: 400px"></input>
        </td>
        </tr>

</table>
<?php } } else { ?>
    <div id="commentsListNewData" class="commentStyle" style="visibility: hidden; width: 96%"></div>
    <br>
    <div class="font2" style="text-align: center">Sorry but you are not associated with any churches. Click <span class="link-font1" id="findChurch">here</span> to find your church.</div>
    <?php } ?>
        <div id="newData"></div>
</div>
</div>
</td>

Answer 1

prepend ? http://api.jquery.com/prepend/

Its not exactly clear what you want, but jQuery is likely have the specific built in function for it. And as mentioned elsewhere you have two commentsList, which rings an alarm bell.