CODEWITHSUNDEEP
jqueryhtml
user1432124
user1432124

Reputation:

append element to last in its own div

I have ten divs with class pcre in a single div whose id is huge.How can I move div(having class=pcre) to last in div(id=huge) on mouseclick with jQuery

I have tried

<div id="huge">
   <div class="pcre">a</div>
    <div class="pcre">b</div>
    <div class="pcre">c</div>
    <div class="pcre">d</div>
    <div class="pcre">e</div>
    <div class="pcre">f</div>
    <div class="pcre">g</div>
    <div class="pcre">h</div>
    <div class="pcre">i</div>
    <div class="pcre">j</div>
    </div>
<script>
  $(".pcre").click(function() {
       $(this).appendTo("#huge");$(this).remove(); 
  });
</script>

But its not working.

Upvotes: 0

Views: 96

Answers (2)

Tats_innit
Tats_innit

Reputation: 34107

Hiya demo http://jsfiddle.net/TPHy8/4/ or http://jsfiddle.net/TPHy8/6/

You have extra , comma in your code. remove it and bingo!! B-) Anyhoo and '.remove` can be removed.

Hope this helps bruv! please let me know if I am missing anything else!

code

updated

$(".pcre").click(function(){
$(this).appendTo("#huge");
   // $(this).remove(); 
 });​

$(".pcre").click(function(){
$(this).appendTo("#huge");
    $(this).remove(); 
 });​

Upvotes: 1

Jonathan Payne
Jonathan Payne

Reputation: 2223

You have an extra comma before your function(), and you also don't need the .remove();

<div id="huge">
   <div class="pcre">a</div>
    <div class="pcre">b</div>
    <div class="pcre">c</div>
    <div class="pcre">d</div>
    <div class="pcre">e</div>
    <div class="pcre">f</div>
    <div class="pcre">g</div>
    <div class="pcre">h</div>
    <div class="pcre">i</div>
    <div class="pcre">j</div>
    </div>
<script>
$(".pcre").click(function(){
$(this).appendTo("#huge"); 
 });</script>​

Upvotes: 1

Related Questions