title: Change color of the text in contenteditable div
body: <p><a href="https://jsfiddle.net/j4dcbovo/2/" rel="noreferrer">Demo is here</a></p>
  
  <p>I have a contenteditable div. I want the functionality in the div as follows:</p>
  
  <p>When I click on red anchor tag, the new text that I will write will be of red color, and when clicked blue, the text should start writing with  blue color.<br>
  Note: When click on the blue color anchor, the content written in red color should not get blue and vice versa. This means that in the div, we will have text written in red and blue color at last. I can write text anywhere in the div.</p>
  
  <pre><code>$("#red").click(function () {
      $("div").addClass("red");
      $("div").removeClass("blue");
  });
  
  $("#blue").click(function () {
      $("div").addClass("blue");
      $("div").removeClass("red");
  });
  </code></pre>
  
  <p>Problem: The problem in my code is that when i click on red, it changes all the color of the div in red and same as of blue.</p>