Disable JavaScript in iframe/div

You can set Content Security Policy as script-src 'self' in header. CSP will block any scripts other than from our own website. This way we can prevent any scripts from iframe changing the elements in our page.

You can get more information from here http://www.html5rocks.com/en/tutorials/security/content-security-policy/

Yes, your update is correct. You must assume that any input you receive from the user may contain malicious elements. Thus, you must validate on the server before accepting their input.

HTML5 introduces the sandbox attribute on the iframe that, if empty, disables JavaScript loading and execution.

You can try the same solution adopted by CKEditor, of which you have a demo here.
By switching from RTE mode to view source mode, you can enter some JavaScript and see the result, which is a replacement of the JS node in a safely encoded string.
If you are in view source mode, by entering some JS line like:

<script type="text/javascript">
// comment
alert('Ciao');
</script>

you will see it rendered this way when going back to rich text editor mode:

<!--{cke_protected}%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0D%0A%2F%2F%20comment%0D%0Aalert('Ciao')%3B%0D%0A%3C%2Fscript%3E-->

I think it is one of the easiest and effective way, since the RegExp to parse JS nodes is not complex.
An example:

var pattern = /<script(\s+(\w+\s*=\s*("|').*?\3)\s*)*\s*(\/>|>.*?<\/script\s*>)/;
var match = HTMLString.match(pattern); // array containing the occurrences found

(Of course, to replace the script node you should use the replace() method).

Regards.