title: How to promote DOM range after inserting a Node?
body: <p>I insert a node and when insert another it substitutes the previously inserted one. </p>
  
  <p>I guess I need to put the range after the firstly inserted node, but how?</p>
  
  <p>I define a function:</p>
  
  <pre><code>function EmoticonsMenu(jquery_element){
    var e = jquery_element;
    var top  = e.offset().top;
    var left = e.offset().left;
    var onIconClick_callback;
  
    this.onIconClick = function(eventObject){
      var html = $(eventObject.target).parent().html().replace(/\n\s+|\s+\n/g, '');
      onIconClick_callback(html);
      };
  
    e.blur(function(){
      e.css({visibility:'hidden'});
      e.hide();
      });
  
    this.attach_to = function(element, callback){
      onIconClick_callback = callback;
      var newTop  = element.offset().top  - top  - 10 - e.height();
      var newLeft = element.offset().left - left + 10;
      e.css({top:newTop, left:newLeft});
      e.css({visibility:'visible'});
      e.focus();
      };
  };
  </code></pre>
  
  <p>and there is a place where I bind Emoticon to my nicEditor custom button</p>
  
  <pre><code>  nicEditorExampleButton = nicEditorButton.extend({   
      mouseClick : function(eventObject) {
      // get nicEdit selected instance - se
      var se = this.ne.selectedInstance;
  
      var paste_icon_html = function(html){
        // create a DOM node from the string
        //var html = '&lt;img src="/assets/emoticons/ac.gif"&gt;admin is here!&lt;/img&gt;';
        var div = document.createElement('div');
        div.innerHTML = html;
        var node = div.childNodes[0];
  
        // get selection if any, insert html as a Node
        var range = se.getRng();
        range.deleteContents();
        range.insertNode(node.cloneNode(true));
        //range.setStart(node,0);
        //range.setEnd(node,0);
        };
  
      emoticonsMenu.attach_to($(this.button), paste_icon_html);
      }
    });
    nicEditors.registerPlugin(nicPlugin,nicExampleOptions);
  </code></pre>