<script type="text/javascript">
    $(document).ready(function() {
        setClickable();
    });

    function setClickable() {
    $('#editRank').click(function(){
    var textarea = '<div><textarea rows="10" cols="60">' + $(this).html() + '</textarea>';
    var button = '<div><input type="button" value="save" class="saveButton" /> OR <input type="button" value="cancel" class="cancelButton"</div></div>'
    var revert = $(this).html();
    });

    $(this).after(textarea+button).remove();
    $('.saveButton').click(function(){saveChanges(this, false);});
    $('.cancelButton').click(function(){saveChanges(this, revert);});
    .mouseover(function() {
        $(this).addClass("editable");
    })
    .mouseout(function() {
        $(this).removeClass("editable");
    });
    }
</script>
<div id="editRank">This should be editable</div>