Alternar estilo de JavaScript não funciona primeiro clique

Eu estou fazendo este pequeno aplicativo html com um menu lateral que aparece ao clicar. Ele funciona bem, exceto que ele só começa a funcionar após o segundo clique. No primeiro clique nada acontece.

CSS:

#menubalk{
   margin-left: -260px;
}

HTML:

<div id="menubutton">
   <img src="design/images/menu.png" id="menu" onclick="toggle()" alt=""/>
</div>

<div id="menubalk">
   <h5>Menu</h5>
</div>

Javascript:

function toggle () {
  var el = document.getElementById("menubalk");
  var kop = document.getElementById("kop");
  var pag = document.getElementById("pagina");

  if ( el.style.marginLeft=="-260px" ) {
     el.style.marginLeft="0px";
     kop.style.marginLeft="260px";
     pag.style.marginLeft="260px";
  } else {
     el.style.marginLeft="-260px";
     kop.style.marginLeft="0px";
     pag.style.marginLeft="0px";
  }
}

Eu acho que eu poderia ter que definir a margem em algum lugar no javascript também, mas eu não consigo descobrir isso.

Toda ajuda é bem-vinda!