javascript - Document.getElementById issue (accessing width attribute) -

i've tried adding .style, .style.width, , .style.width.value parts of javascript, no avail far.

essentially, 2 things.

1. to alert of value of 50px "animate" button click, runs anim8 function. in other words, want width of div.

2. in second set of code (anim82), want able set/change width via button click. add 10px when button clicked. first, need access variable though, width, before can change anything.

html

 <div id="maintxt">dag!</div>  <form name="myform" action="" method="get">  <input type="button" name="button" value="animate" onclick="anim8(this.form)">  <input type="button" name="button" value="animate2" onclick="anim82(this.form)"> 

css

#maintxt{width:60px;} 

javascript

var divalert; var divsize;  function anim8(form) {     divalert=document.getelementbyid("maintxt");     alert(divalert); }  function anim82(form) {     divsize=document.getelementbyid("maintxt");     divsize.style.width=parseint(divsize.style.width)+10+'px'; } 

try this

function anim82(form) {     divsize=document.getelementbyid("maintxt");     var width=divsize.offsetwidth + 100;     divsize.setattribute("style","width:"+ width +"px")     } 

js fiddle example