Aligning an image to the right side of a div

Question

Using JQuery JEditable, I have the following code below which allows the user to create virtual post-it notes, so to speak, and I'm trying to make it so that beside each div created, a delete image that the user can simply click on. I feel that I'm almost there, I'm just missing something. As of right now the image appears only on the right side of the appended divs and not beside the first div. Any ideas? Should I dynamically create the first div?

<script type="text/javascript">
    $(document).ready(function() {
        $('.edit_area').editable(function(value, settings) {
            return (value);
        }, {
            type: 'textarea',
            onblur: 'submit',
            indicator: 'Saving...',
            callback: function(value, settings) {

                $.post('<%=Url.Action("SetPostieNotes", "Posties") %>', { id: 0, content: escape(value) }
                );
                function S4() {
                    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
                }
                var uuid = (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());


                    var del_img = $('<div><img src="<%=Url.Content("~/Content/images/delete_14.png") %>" /> </div>');
                    var new_div = $('<div style="float: left; width:98%; text-align: left;" id=' + uuid + '>')
                          .addClass('edit_area')
                          .editable('<%=Url.Action("SetPostieNotes", "Posties") %>', settings);
                    $(this).parent().append(new_div);                                    
                    $(this).parent().append(del_img);

            }
        });
    });


</script>

<div style="float: left; width:98%; text-align: left;" class="edit_area" id="empty"></div>

Answer 1

How about floating img to the right instead?