SuprFormat

HTML

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css">
<body>
  <div contenteditable="true" id="div">
    <h1>Un <span class="red">premier</span> h1...</h1> 
    <p>Un paragraphe...</p>
    <p>Et ici <span class="red">un deuxième</span> paragraphe</p> 
  </div>
  
  <textarea id="textarea1">contenu de la div...</textarea>
  <br/><br/>
  <input type='button' value='suprColorRed' id='suprColorRed'/>
  <input type='button' value='bold' id='bold'/>
  <input type='button' value='italic' id='italic'/>
  <input type='button' value='arial' id='fontname'/>
  
  <input type='button' value='restore' id='restore'/>
</body>

CSS

body {
  font-family: verdana;
  font-size: 13px;
}

.red {
  color: red;
}
#textarea1
    {
       color:blue;
       height: 150px;
       width: 700px;
    }

JavaScript

$(document).ready(function () {

 $('#suprColorRed').click(function () {  
		var redSpans = document.querySelectorAll('span.red');

		for (var i = 0, len = redSpans.length; i < len; i++) {
  		var $redSpan = redSpans[i];
      var textNode = document.createTextNode($redSpan.textContent);
  		$redSpan.parentNode.replaceChild(textNode, $redSpan);
    }
 });
 
  var copydiv = document.getElementById('div').innerHTML ; 
  $('#textarea1').val(copydiv);   
  $('#restore').click(function () {      
     document.getElementById('div').innerHTML = copydiv ; 
  });


  $('#bold').click(function () {      
      document.execCommand('bold', false, null);
  });
    
  $('#italic').click(function () {      
        document.execCommand('italic', false, null);       
  });
  
  $('#fontname').click(function () {      
      document.execCommand('fontname', false, 'arial');      
  });
    
  $('body').click(function () {
  	$('#textarea1').val($('div').html()); 
  });   
    
  $('body').keyup(function () {
  	$('#textarea1').val($('div').html()); 
  });   
    
});




















//fin