CODEWITHSUNDEEP
jqueryhtml
BentCoder
BentCoder

Reputation: 12740

Content of element disappear after updating different element

When I click a box the title of clicked box disappear after updating content of different element. Any idea why? Content of clicked box should remain intact.

http://jsfiddle.net/wdQ6j/1/

HTML

<div id="school_left_box">
    <p class="register_title">School</p>This is a box
</div>

<div id="representative_left_box">
    <p class="register_title">Representative</p>This is a box
</div>

<p class="register_title form">Hello</p>

JQUERY

$(document).ready(function()
{
    $("#school_left_box").click(function()
    {
        var title = $(".register_title", this);

        $("#hidden_registration_type").html('School');
        $(".register_title.form").html(title);
        $("#register_right_box").fadeIn(300);
    });

    $("#representative_left_box").click(function()
    {
        var title = $(".register_title", this);

        $("#hidden_registration_type").html('Representative');
        $(".register_title.form").html(title);
        $("#register_right_box").fadeIn(300);
    });
});

Upvotes: 0

Views: 41

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388396

Instead of copying the content of title, you are moving the title element, try var title = $(".register_title", this).html()

$("#school_left_box").click(function() {
    var title = $(".register_title", this).html();

    $("#hidden_registration_type").html('School');
    $(".register_title.form").html(title);
    $("#register_right_box").fadeIn(300);
});

Demo: Fiddle

Upvotes: 2

Related Questions