How to add on click a li element to another container and rest of li stay fixed
<p>I have a litle problem:</p>

<p>I have this list:</p>

<pre><code>&lt;ul id="nextlevel"&gt;
&lt;li class="listadetalii"&gt;&lt;a style="width:100%;color:red;font-weight:600;cursor:pointer" rel="03.Accessories" data-folder="01.Hi tech (028_003)" data-titlu="Hi tech" id="01.Cosuri si cuiere" class="red-gros singlelink folder"&gt;Hi tech&lt;p style="width:100%;color:#828282;font-size:70%" class="muted"&gt;Luni, 18 Mar 2013 16:07:14&lt;/p&gt;&lt;/a&gt;

    &lt;ul class="detalii-produs hide"&gt;
        &lt;li class="togo"&gt;Image 1&lt;/li&gt;
        &lt;li class="detalii-produs-lista dropdown-submenu"&gt;&lt;a href="#" style="float:right;margin-right:15px;width:100%;font-size:12px;" class="pull-right"&gt;Fișă produs&lt;/a&gt;

        &lt;/li&gt;
        &lt;li class="detalii-produs-lista dropdown-submenu"&gt;&lt;a href="#" style="float:right;margin-right:15px;width:100%;font-size:12px;" class="pull-right"&gt;Listă prețuri&lt;/a&gt;

        &lt;/li&gt;
    &lt;/ul&gt;
&lt;/li&gt;
&lt;li class="listadetalii"&gt;&lt;a style="width:100%;color:red;font-weight:600;cursor:pointer" rel="03.Accessories" data-folder="02.Net (028_002)" data-titlu="Net" id="01.Cosuri si cuiere" class="red-gros singlelink folder"&gt;Net&lt;p style="width:100%;color:#828282;font-size:70%" class="muted"&gt;Marti, 16 Apr 2013 09:53:43&lt;/p&gt;&lt;/a&gt;

    &lt;ul class="detalii-produs hide"&gt;
        &lt;li class="togo"&gt;Image 2&lt;/li&gt;
        &lt;li class="detalii-produs-lista dropdown-submenu"&gt;&lt;a href="" style="float:right;margin-right:15px;width:100%;font-size:12px;" class="pull-right"&gt;Fișă produs&lt;/a&gt;

        &lt;/li&gt;
        &lt;li class="detalii-produs-lista dropdown-submenu"&gt;&lt;a href="" style="float:right;margin-right:15px;width:100%;font-size:12px;" class="pull-right"&gt;Listă prețuri&lt;/a&gt;

        &lt;/li&gt;
    &lt;/ul&gt;
&lt;/li&gt;
&lt;li class="listadetalii "&gt;&lt;a style="width: 100%; color: red; font-weight: 600; cursor: pointer; outline: medium none;" rel="03.Accessories" data-folder="03.)" data-titlu="Cuiere" id="01.Cosuri si cuiere" class="red-gros singlelink folder"&gt;Cuiere&lt;p style="width:100%;color:#828282;font-size:70%" class="muted"&gt;Luni, 18 Mar 2013 10:53:47&lt;/p&gt;&lt;/a&gt;

    &lt;ul class="detalii-produs hide" style="display: none;"&gt;
        &lt;li class="togo"&gt;Image 3&lt;/li&gt;
        &lt;li class="detalii-produs-lista dropdown-submenu"&gt;&lt;a href="" style="float:right;margin-right:15px;width:100%;font-size:12px;" class="pull-right"&gt;Fișă produs&lt;/a&gt;

        &lt;/li&gt;
        &lt;li class="detalii-produs-lista dropdown-submenu"&gt;&lt;a href="" style="float:right;margin-right:15px;width:100%;font-size:12px;" class="pull-right"&gt;Listă prețuri&lt;/a&gt;

        &lt;/li&gt;
    &lt;/ul&gt;
&lt;/li&gt;
</code></pre>

<p>
This list is collapsed. When i click on <strong>"Hi tech"</strong> a next list is expanded and the content is visible.
I want the content of the li element class togo  to go on div alfa and hide li and the rest of li-s stay on this list.</p>

<p>Same behavior for the rest of elements Net, Cuiere...</p>

<pre><code>&lt;div id="alfa"&gt;here must be Image (n)&lt;/div&gt;
</code></pre>

<p>More detalied code on fiddle <a href="http://jsfiddle.net/gxg1974/Jy3EK/" rel="nofollow">http://jsfiddle.net/gxg1974/Jy3EK/</a></p>

<p>Thank you all for tips and guidance.</p>
