This is the code you need to do something when clicked.  In this example I'm using jQuery to show a dialog box when clicked.

{codecitation class="brush:javascript"}
<script type="text/javascript">
    $(function() {
        $("#dialog").dialog({ autoOpen: false });
    });
</script>

<script type="text/javascript">
     $(document).ready(function(){
       $("#opener").click(function(event){
         $("#dialog").dialog('open')
       });
     });
</script>{/codecitation}This is the body html for the page dialog box {codecitation class="brush:html"}<div id="dialog" title="Basic dialog">
    <p>This is the dialog box :)</p>
</div>{/codecitation}These are possible ways you can call the function

{codecitation class="brush:html"}<span class="blah" id="opener">click to show dialog</span><br />{/codecitation}
{codecitation class="brush:html"}<a href="#" id="opener">click to show dialog</a><br />{/codecitation}
{codecitation class="brush:html"}<button id="opener" style="border:none; background:transparent; cursor: pointer;">click to show dialog</button><br />{/codecitation}
With these two methods you don't have to use second part of the javascript above{codecitation class="brush:html"}<div id="whatever" onclick="$('#dialog').dialog('open');return false;" style="cursor: pointer;">click to show dialog inline</div><br />{/codecitation}
{codecitation class="brush:html"}<a href="#" onclick="$('#dialog').dialog('open');return false;">click to show dialog inline</a>{/codecitation}
{codecitation class="brush:html"}<img src="/images/whatever.png" border="0" style="cursor: pointer;" onclick="$('#dialog').dialog('open');return false;">{/codecitation}