Question

Sorry for this title impossible to understand.

I have this:

<a class="directory">
    Directory 1
    <a class="add">Add a file</a> //show/hide on mouseover
</a>

for:

I do a toggle when I click on the first <a> to view the files :

$('a.directory').click(function() {
    $(this).parent().find('ul:first').slideToggle('medium');
});

I add a file when I click on the second <a>.

How do I check that I just click on the first <a> to avoid opening the folder when I click on the second <a>?

I try this but doesn’t work:

$('a.directory:not(.add)').click(function() {
    $(this).parent().find('ul:first').slideToggle('medium');
});

Answer 1

Pull the second <a> out of the first one, that is not valid HTML anyway. Then you can format using CSS to get the same effect stylistically.

<a class="directory">
     Directory 1
</a>
<a class="add">Add</a>

Your selectors should then work as you’d expect.