Ustawianie kursora na końcu treści div'a

Question

Witam. Chcę zrobić w js przeskakiwanie pomiędzy divami z contenteditable="true", za pomocą strzałek. Jednak, gdy łapiąc zdarzenie kliknięcia strzałki dam focusa na konkretny div to pionowy migający kursor ustawia się przed tekstem, a nie za tekstem - tak jakbym chciał.

Poszperałem w internecie i znalazłem taki kod:

if (typeof window.getSelection != "undefined" && typeof document.createRange != "undefined") {
    var range = document.createRange();
    range.selectNodeContents(el);
    range.collapse(false);
    var sel = window.getSelection();
    sel.removeAllRanges();
    sel.addRange(range);
} else if (typeof document.body.createTextRange != "undefined") {
    var textRange = document.body.createTextRange();
    textRange.moveToElementText(el);
    textRange.collapse(false);
    textRange.select();
}

Wszystko ładnie działa, jednak nie rozumiem większości linijek. Wyszukiwałem funkcje tu użyte, ale nie dałem sobie rady.

Byłby ktoś tak miły, żeby wyjaśnić mi linijka po linijce o co tu chodzi?

Poza tym wydaje mi się, że można to wszystko zapisać krócej i używając jQuery - tylko jak?