title: Inner DIV color text is not changing on MOUSE HOVER
body: <p><strong>This is my requirement:</strong></p>
  
  <p>I have <em>"Ttile"</em> and <em>"Description"</em> .</p>
  
  <ol>
  <li>On page Load, "outerElementsContainer"(DIV ID) div background should
  be WHITE</li>
  <li>"Title" &amp; "Border" Color should be GREEN, "Description color should
  be to BLACK.</li>
  <li>On mouse hover of "outerElementsContainer"(DIV ID) div, DIV
  background should change to  GREEN</li>
  <li>"Title" Color should change to WHITE, "Description" color should
  change to WHITE.</li>
  <li>On mouse out of "outerElementsContainer"(DIV ID) div, DIV background
  should change to  WHITE</li>
  <li>"Title" &amp; "Border" Color should change to GREEN, "Description" color
  should change to BLACK.</li>
  </ol>
  
  <p><strong>I am stuck at "Description" color. It is not changing on mouse hover.</strong></p>
  
  <p><strong>Below is my HTML code:</strong></p>
  
  <pre><code> &lt;div id="outerElementsContainer"&gt;
   &lt;div id="123456" name="123456"    onMouseOut="this.style.background='WHITE';this.style.color='GREEN';"
  onmouseover="this.style.background='GREEN';this.style.color='WHITE';"
  style="float:left; margin-right:2em;cursor: pointer;   color:'GREEN';width:18em;height:12em; 
    border-color:'GREEN'; border-width:1px;margin-top: 1em;      border-style:solid;"&gt;
  
                       &lt;div id="InnerDiv1" 
                       style="background-color:'GREEN';height:0.5em;margin-bottom: 10px;"&gt;
                       &lt;/div&gt;
  
                       &lt;div id="InnerDiv2"
                       style="height: 3.5em; overflow: hidden;margin-left: 0.5em;font-size: larger;font-weight: bold;"&gt;
                           &lt;p id="title"&gt;Title&lt;/p&gt;
                       &lt;/div&gt;
  
                       &lt;div id="InnerDiv3" 
  
                       style="height: 5em;overflow: hidden;margin: 0.5em;color:black;"&gt;
                           &lt;p id="Description"&gt;Description&lt;/p&gt;
                       &lt;/div&gt;
                   &lt;/div&gt;  
  
               &lt;/div&gt;
  </code></pre>
  
  <p>How to solve this??      </p>