Clickable bullet

[difrad76]

I am not sure whether this question needs to be asked on JavaScript forum or CSS forum so I post it here.

I have a list like so

<ul class="treeClosed">
<li id="menuOption1" onClick="openMenu('1'); return false;" class="treeClosed">
First Button</li>
<ul id="menu1" style="display:none" type="square">
<li class="tree">First Option</li>
<li class="tree">Second Option</li>
</ul>

<li id="menuOption2" onClick="openMenu('2'); return false;" class="treeClosed">
Second Button</li>
<ul id="menu2" style="display:none" type="square">
<li class="tree">First Option</li>
<li class="tree">Second Option</li>
</ul>
</ul>

What I want to do is to be able to click on bullets. Is it possible at all? Do I need to enable some sort off property with CSS? Or, should I be able to do this with JavaScript ?

[bokeh]

you could make list-style:none; and then use your own bullet as follows without javascript:
<li class="whatever"><a href="url_here"><img src="bullet.png"></a> List item text here</li>

[difrad76]

But then I'd need to make sure that the image doesn't appear higher then a link. How do I do that ?

[bokeh]

If that does turn out to be a problem you can position it absolutely and then move it up and down by applying a negative or posative top margin. Do it as a class as all the <li>s will be the same.