jquery - How to pull the value from one div into another?

Question

I'm trying to achieve something that should be fairly simple, but it doesn't work.

There are 2 divs one one page and I want to pull the value from one into another on a link click.

Here is jsfiddle example: http://jsfiddle.net/SdWSs/2/

Here is the body code:

<div id="divone">ValueOne</div>
<input id="two">DIV two</div>
<a onclick="pullthevalue()" href="javascript:void(0);">Pull</a>

Function

function pullthevalue(){
var textValue = $('#divone').text();
$('#two').text(textValue);
}

Answer 1

Change $('#two').text(textValue) to $('#two').val(textValue);

Working jsfiddle: http://jsfiddle.net/SdWSs/3/

Update JSfiddle http://jsfiddle.net/SdWSs/5/

Changed <input id="two">DIV two</div> to <div id="two">DIV two</div> so .text(textvalue) will work

Answer 2

Try not to use onclick events tied to attributes, it's a deprecated method. Instead bind events to the DOM using jquerys .on or .click methods on the element.

You can achieve exactly what you want using either of these methods.

$(document).ready(function()
{
    $('a').click(function(e)
    {
        var value = $('#divone').text();

        $('#two').text(value);

        return false;
    });
});

Alternative method using .on

$(document).ready(function()
{
    $(document).on('click', 'a', function(e)
    {
        var value = $('#divone').text();

        $('#two').text(value);

        return false;
    });
});

Answer 3

try changing text() to innerHTML()... that should work. Also, the a tag can just have the href as javascript:pullthevalue() and you can take the onclick off.