Javascript-форум - Переместить блок к "предродителю".

Код:

<div class="lot">

       <div class="lot1">

                <div class="lot2">

                        <div>Click here</div>

                        <div>to iterate through</div>

                        <div>these divs.</div>

                </div>

        </div>

</div>

<div class="lot">

       <div class="lot1">

                <div class="lot2">

                        <div>Click here</div>

                        <div>to iterate through</div>

                        <div>these divs.</div>

                </div>

        </div>

</div>



<script>



$( document.body ).click(function() {

        var lot2 = $('.lot2'); 



        lot2.each(function(i, a) {



                 a.detach().prependTo(a.parent.parent);

        });

});

</script>

Требуется найти все div с классом lot2. И переместить этот блок к прородителю с классом lot.

Не совсем понимаю как работает "parent".

Буду рад помощи.

<html> <head> <style> .lot{background: blue; padding: 10px} .lot1{background: green; padding: 10px} .lot2{background: yellow; padding: 10px} </style> </head> <body> <div class="lot"> <div class="lot1"> <div class="lot2"> <div>Click here</div> <div>to iterate through</div> <div>these divs.</div> </div> </div> </div> <div class="lot"> <div class="lot1"> <div class="lot2"> <div>Click here</div> <div>to iterate through</div> <div>these divs.</div> </div> </div> </div> <script> lots=document.querySelectorAll(".lot") lots2=document.querySelectorAll(".lot2") f=function(parent){return function(){parent.appendChild(this)}} for (var i=0; i<lots.length; i++){ lots2[i].onclick=f(lots[i]) } </script> </body> </html>