Question

Anyone know why this isnt working?

css

#test1
{
    height: 50px;
    border: 1px solid black;
}

#test2
{
    height: 50px;
    color: red;
    border: 1px solid black;
}

html

<div id="test1">
    test<br />
    Text
</div>
<br />
<div id="test2">
</div>

jquery

$(document).ready(function(){
    if($("#test1").val() != "")
    {
        $("#test2").val($("#test1").val());
        $("#test2").val("");
    }
});

I also have a link of the code here to play with: http://jsfiddle.net/FDe9N/4/

on the $(document).ready doesnt the site fully load before executing the code? and if so doesnt that mean the div should already contain the text? the code doesnt hit the code in the if statement as if the div was empty when in fact it does have text in it… Thanks in advance!

Answer 1

val() only gets or sets the value of form elements. Since you’re using <div> elements, you should use text() or html() instead:

$(document).ready(function() {
    if ($("#test1").html() != "") {
        $("#test2").html($("#test1").html());
        $("#test1").empty();
    }
});