[jQuery] Stop a button within an li taking the li event?

I have an unordered list which slidesdown to reveal a sub list on
click event. In the first li there is also a button that takes you to
another page. When this button is pressed I don't want the slide down
to start, which it currently does as the button is within the li.

[code]

$("#vml_top_ul li").click(function() {
$(this).css({'background-color':''});
if ($(this).children("ul.vml_second_ul").is
(":hidden")) {
$(this).children("ul.vml_second_ul").slideDown(1000,
function() {
$(this).parent("li").addClass("vml_top_li_open");
});
} else {
$(this).children("ul.vml_second_ul").slideUp(1000, function() {
$(this).parent("li").removeClass("vml_top_li_open");
});
}
});

HTML

<ul id="vml_top_ul">
<li class="vml_top_li_closed"><h3>Images</h3><span class="right">
<form name="form_add" method="post" action="edit_vml.asp"
enctype="multipart/form-data">
<input type="submit" name="add" value="ADD NEW"
class="link_button" />
</form></span><br />
<ul class="vml_second_ul">
<li class="top">&nbsp;</li>
<li>&nbsp;</li>
</ul>
</li>
<li class="vml_top_li_closed"><h3>Videos</h3><span class="right">
<form name="form_add" method="post" action="edit_vml.asp"
enctype="multipart/form-data">
<input type="submit" name="add" value="ADD NEW"
class="link_button" />
</form></span><br />
<ul class="vml_second_ul">
<li>&nbsp;</li>
<li>&nbsp;</li>
</ul>
</li></li>
</ul>
[/code]

I have tried various uses of .not() and :not() to try and stop the
action taking place but I'm getting know where with it. Any help would
be very much appreciated?

Thanks

Richard