Select only one element at a time from a group ("OR" case)

I have group or list of elements, and I need to select only one element from the list, just like in an "OR" case: Select this one OR just this one, but not more than one.

In the following DEMO you'll see the accordion has two lists, top and bottom. Only the top list (Title 1) should have the "OR" case; the bottom list is working fine with "AND" case.

I'm not sure if this solution needs a separate function to work (which is what I've tried myself, but with no success), or if it has to be included in the main function.

I think I will need to give the corresponding UL its own class to be able to target it, so that's what I did: <ul class="acitem or-list">.

FYI, I did not create the majority of the script, I received help doing it since I'm just starting to delve into jQuery.

Any help on this is greatly appreciated.

Tha开发者_高级运维nks.

This will select the first element that has one of those classes.

$('.acitem, .list').first()

Have you considered a radio button group instead of list 1?

You seem to be trying to replicate this behavior, and it would be far more robust to use compnents that have this "OR" behavior naturally. You can do some pretty theming with radio buttons with jQuery UI. See this demo.

In a similar way, you could replace list 2 with checkboxes (demo here).