copy td background color and set div to the color when clicked

How can i take the bgcolor and title of a td and then set a div to that color and write out the title next to the div

<div id="boxcolor1开发者_StackOverflow中文版">change color</div><div id="boxtext1">write td title here</div>


<table id="box1"><tr><td title="Maroon" bgcolor="#5A0014"></td></tr></table>

I'm sure it's possible but i can't see it working for me......

Thanks

Try this jquery code

$("#box1 tr td").bind("click",function(){         
       $("#boxtext1").html($(this).attr("title"));
       $("#boxcolor1").css("background-color",$(this).attr("bgcolor"));
});

Here, we are looping through each td, and whenever user clicks on any td, we are reading its title and bgcolor attributes and setting it to given divs appropriately.

Working Demo

Here you have it:

var cell=$("table#box1 tr td:first");
var title=cell.attr("title");
var color=cell.attr("bgcolor");

$("#boxcolor1").css({"background":color});
$("#boxtext1").text(title);

$("table#box1 tr td").click(function(){
   var bgcolor = $(this).attr("bgcolor");
   var title   = $(this).attr("title");
   $("boxcolor1").css("background-color",bgcolor);
   $("boxtext1").html(title);
})

Happy coding