Using JavaScript to load HTML into DIV

Question

I'm trying to load some HTML into a DIV using JavaScript, but I can't alter the size of the DIV frame, no matter what I try. All I get is a small little frame in the middle of the browser window. I've tried CSS. I've tried 'width:' and 'height:'. Here's my code:

<div id="main">
</div>
<script type="text/javascript">
    document.getElementById('main').innerHTML =
        '<object type="type/html" data="welcome.html"><\/object>';
</script>

Don't concern yourself about why I want to do this -- it's part of a greater coding experiment.

Answer 1

Can you use jquery? Then it becomes trivial...

$('#main').load('welcome.html');

Answer 2

It seems to set the width

document.getElementById('main').innerHTML ='<object type="type/html" data="newhtml.html"><\/object>';
document.getElementById('main').style.width = "600px";
document.getElementById('main').style.border = "solid red 1px";

shows that the width is set to 600px