Hey,

This is my first time with AJAX, so I'm a bit confused and need your help. I have four div id's and want to toggle hide/show between them based on result from database. Sounds simple, eh! But it is hard to implement for me. HELP!.

This is my code -

<div id="1">HEya</div>
<div id="2">What's up?</div>
<input type="submit" id='approve' name="action" value="Approve" onclick="a()" class="approve" />
<input type="submit" id='reject' value="Reject" name="action" onclick="r()" class="reject"/>

<script language="javascript" type="text/javascript">
//if cookie exists, at the beginning the form should be hidden


if (<?php $responseanswer['response']=='approve'; ?> ){

document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display = 'inline';

}

//if user clicks reject, hide one element dislay another

else if (<?php $responseanswer['response']=='reject'; ?>){
//if cookie exists
document.getElementById('2').style.display = 'none';
document.getElementById('1').style.display = 'block';

}

else
{


function a()
{
 var a = document.getElementById('2');

document.getElementById('1').style.display= 'block';


}

//on reject creating a new cookie

function r()
{
 var a = document.getElementById('reject');
 document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display= 'block';


}

}

</script>

Eveything is fine, but the div is not hiding.