set cursor on empty tag
<p>I'm writing text editor, with some special formatting features, using iframe in design mode. I got a problem when setting cursor position in empty element, e.g.:</p>

<pre><code>&lt;p&gt;&lt;/p&gt;
</code></pre>

<p>i want to set cursor, so when user continued typing text appeared between <code>&lt;p&gt;</code> tags.
Here is my code:</p>

<pre><code>&lt;iframe id="editor"&gt;&lt;/iframe&gt;

$(document).ready(function() {
    var iframe = $('#editor').contents().get(0);
    var iwin = $('#editor')[0].contentWindow;
    iwin.document.designMode = "on";
    $('body', iframe).html('&lt;p&gt;ppp1&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;ppp3&lt;/p&gt;');

    $('#editor').focus();
    var start = $('p', iframe)[1];

    var rng = $('#editor')[0].contentDocument.createRange();
    rng.setStart(start, 0);
    rng.setEnd(start, 0);

    var sel = iframe.getSelection();
    sel.removeAllRanges();
    sel.addRange(rng);

});
</code></pre>

<p><strong>JsFiddle</strong>: <a href="http://jsfiddle.net/xbit/MGaTf/3/" rel="nofollow">http://jsfiddle.net/xbit/MGaTf/3/</a></p>
