Replace text with multiple boxes
<p>I'm starting with jQuery and I need this is a project.</p>

<p>For example I have this:</p>

<pre><code>&lt;ul id="grid"&gt;
  &lt;li class="box1"&gt;Lorem ipsum dolor sit amet!&lt;/li&gt;
  &lt;li class="box2"&gt;Lorem ipsum dolor sit amet!&lt;/li&gt;
  &lt;li class="box3"&gt;Lorem ipsum dolor sit amet!&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>And Information for the grid items</p>

<pre><code>&lt;div class="box_info_1"&gt;Info for grid item&lt;/div&gt;
&lt;div class="box_info_2"&gt;Info for grid item&lt;/div&gt;
&lt;div class="box_info_3"&gt;Info for grid item&lt;/div&gt;
</code></pre>

<p>And a div:</p>

<pre><code>&lt;div id="promo"&gt;I want to set grid info here&lt;/div&gt;
</code></pre>

<p>What i want to accomplish is when I hover over a box, the promo div replaces the content with the corresponding info_box</p>

<p>So when I hover over box1, i want the content of box_info_1 in the promo div</p>
