Javascript function not defined?

Question

I've defined a javascript function:

<script>
function expand()
{
 parent.getElementById("elementA").style.height = 300px;
}
</script>

I'm trying to call it onClick:

<div id="elementB" onclick="expand()">Notif</div>

The web console tells me that expand is not defined when I click on it.

• j08691: Can you post the complete code you're using?
• b_dubb: when you call it add this to your function call in the dom. expand(this). this will pass a reference to the dom element that the event is attached to. just an fyi

Answer 1

You have a syntax error in your javascript, it should be '300px' (a string); This is why the script does not load (which web console probably also tells you), so the function is not defined.

Answer 2

Try putting quotes around 300px, i.e.

<script>
function expand()
{
 parent.getElementById("elementA").style.height = '300px';
}
</script>

Answer 3

When assigning the value for height, you must assign it as a string value.

<script type="text/javascript">
function expand()
{
 // Need to assign the value as a string
 parent.getElementById("elementA").style.height = '300px'; 
}
</script>

I'm assuming this is within an iframe given the parent reference. If not, you might want to change parent to document.