Edit in JSFiddle

$('#editable').on("focus", function(e) {
    window.setTimeout(function() {
        $(e.target).text("")
    }, 100);
});

// Code below this line is to simply reset the element with some text after clicking/tabbing away.
$('#editable').on("blur", function(e) {
    $(e.target).text("Hello")
});

<div id="editable" contenteditable>Hello</div>
<span>In Chrome 21 and below, notice the difference when clicking the text, and clicking an empty space inside the element. The former requires an extra click to focus and reveal the cursor, while the latter takes one click.</span>

#editable { 
    background: #ccc;
    margin: 10px auto;
    width: 300px;
    padding: 5px 10px;
    border: 1px solid #544;
}

span {
    display: block;
    width: 300px;
    margin: 5px auto;
    font-family: arial;
    font-size: 12px;
}