Note that there are some explanatory texts on larger screens.

plurals
  1. POUsing the correct Jquery selectors to migrate content between divs
    primarykey
    data
    text
    <p>Majorly stuck here and would love some help. I am trying migrate the hidden div content of a particular topic to a separate area when it's specific title is clicked. At the minute I can get the content to migrate but instead of the specific topic content it just cycles through the content upon clicking.</p> <p>Sorry for my poor Title, I'm struggling to define my exact problem. Please change if you feel you can do better.</p> <p><a href="http://jsfiddle.net/vBCs5/1/" rel="nofollow">http://jsfiddle.net/vBCs5/1/</a></p> <p>Clicking the grey subtitles migrates the content.</p> <p>Thank you in advance.</p> <p><strong>Jquery:</strong></p> <pre><code>$(document).ready(function() { $(".freemarker-wrap div").hide(); $(".test").click(function () { $(".freemarker").each(function () { var working = $(this).contents(); var ref = $(".content-box").contents(); $(this).append(ref); $(".content-box").append(working); }); }); }); </code></pre> <p><strong>HTML</strong></p> <pre><code>&lt;html&gt; &lt;body&gt; &lt;div class="page-wrap"&gt; &lt;div class="left-column-wrap"&gt; &lt;h1&gt;FreeMarker +&lt;/h1&gt; &lt;div class="freemarker-wrap"&gt; &lt;span class="test"&gt; &lt;h2&gt;Lucene Call &gt;&lt;/h2&gt; &lt;div class="freemarker"&gt; &lt;p&gt;Click to hide stories&lt;/p&gt; &lt;/div&gt; &lt;/span&gt; &lt;span class="test"&gt; &lt;h2&gt;Arrays &gt;&lt;/h2&gt; &lt;div class="freemarker"&gt; &lt;p&gt;Arrays&lt;/p&gt; &lt;/div&gt; &lt;/span&gt; &lt;span class="test"&gt; &lt;h2&gt;Declaring and outputting variables &gt;&lt;/h2&gt; &lt;div class="freemarker"&gt; &lt;p&gt;Declaring&lt;/p&gt; &lt;/div&gt; &lt;/span&gt; &lt;span class="test"&gt; &lt;h2&gt;IF Statements &gt;&lt;/h2&gt; &lt;div class="freemarker"&gt; &lt;p&gt;Statements&lt;/p&gt; &lt;/div&gt; &lt;/span&gt; &lt;span class="test"&gt; &lt;h2&gt;Fragments &gt;&lt;/h2&gt; &lt;div class="freemarker"&gt; &lt;p&gt;Fragments&lt;/p&gt; &lt;/div&gt; &lt;/span&gt; &lt;span class="test"&gt; &lt;h2&gt;Working with Numbers &gt;&lt;/h2&gt; &lt;div class="freemarker"&gt; &lt;h3&gt;Numbers&lt;/h3&gt; &lt;/div&gt; &lt;/span&gt; &lt;span class="test"&gt; &lt;h2&gt;Current Date &gt;&lt;/h2&gt; &lt;div class="freemarker"&gt; &lt;p&gt;Current&lt;/p&gt; &lt;/div&gt; &lt;/span&gt; &lt;/div&gt; &lt;div class="javascript-wrap"&gt; &lt;h1&gt;JavaScript +&lt;/h1&gt; &lt;/div&gt; &lt;div class="javascript-wrap"&gt; &lt;h1&gt;JQuery +&lt;/h1&gt; &lt;/div&gt; &lt;div class="javascript-wrap"&gt; &lt;h1&gt;HTML +&lt;/h1&gt; &lt;/div&gt; &lt;div class="javascript-wrap"&gt; &lt;h1&gt;CSS +&lt;/h1&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="content-box"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload