Javascript to give a richtext field the same style as the page

If you use a richtext field in a list form, the style in the richtext control is different to the style on the page. This is because the richtext field uses an iframe and there is no style applied to the iframe document. So the iframe uses the default font configured in the browser’s settings. In my case “Times New Roman”.

Richtext field uses the browser's default font.
If you want to use the same style as other controls on the page, you can use this simple script code.

This script appends a link element referencing a CSS file to the HTML head of all richtext iframes.

jQuery(document).ready(function ($) {
    //get richtext iframes
    var iframes = $("iframe.ms-rtelong, iframe.ms-rtelonger");
    iframes.each(function () {
    //get the iframe document
        var doc = frames[this.id].document;
    //create a link element
        var link = doc.createElement("link");
        link.setAttribute("rel", "stylesheet");
        link.setAttribute("type", "text/css");
        //reference the style file
        link.setAttribute("href", "/_layouts/15/1033/STYLES/Themable/corev15.css");
    //add the link element to the iframe head
        doc.head.appendChild(link);
    });
});
jQuery(document).ready(function ($) {
    //get richtext iframes
    var iframes = $("iframe.ms-rtelong, iframe.ms-rtelonger");
    iframes.each(function () {
	//get the iframe document
        var doc = frames[this.id].document;
	//create a link element
        var link = doc.createElement("link");
        link.setAttribute("rel", "stylesheet");
        link.setAttribute("type", "text/css");
        //reference the style file
        link.setAttribute("href", "/_layouts/15/1033/STYLES/Themable/corev15.css");
	//add the link element to the iframe head
        doc.head.appendChild(link);
    });
});

Note: I appended the corev15.css file from the 1033/STYLE/Themable folder. Change the URL if you want to use another css-file.

Include this script code in your custom js file or use a content editor web part to add the code to the form.

Richtext use same font than the page.