I am trying to open a context popup menu when the menu button is pressed. What happens now is that the popup quickly appears and then disappears. Any ideas?  Thanks in advance.

HTML Code

<div data-role="page" id="upcoming_page">
	<div class="header" data-role="header" data-position="fixed">
	</div>
	<!-- /header -->

	<div class="content" data-role="content" data-scroll="y">
	</div>
	<!-- /content -->

	<div data-role="footer" data-id="upcoming_page_footer">
		<a id="upcoming_page_settings_menu_btn" href="#upcoming_page_settings_menu" data-role="button"
			data-icon="naviframe-more" data-rel="popup"></a>
		<div id="upcoming_page_settings_menu" data-role="popup">
			<ul data-role="listview">
				<li><a href="#settings_general_page">Settings</a></li>
			</ul>
		</div>
	</div>
	<!-- /footer -->
</div>

Javascript Code:

$(document).on('tizenhwkey', function(e) {
    if (e.originalEvent.keyName === "menu") {
		$("#upcoming_page_settings_menu_btn").click();
	}
});