Здравствуйте уважаемые специалисты. Помогите пожалуйста разобраться.
Имеется конструкция:
<div id="container" class="tags-container clearfix">
<div class="tags"><a href="#">A1 <span>B1 </span></a></div>
<div class="tags"><a href="#">A2 <span>B2 </span></a></div>
<div class="tags"><a href="#">A3 <span>B3 </span></a></div>
<div class="tags"><a href="#">A4 <span>B4 </span></a></div>
<div class="tags"><a href="#">A5 <span>B5 </span></a></div>
<div class="tags"><a href="#">A6 <span>B6 </span></a></div>
<div class="tags"><a href="#">A7 <span>B7 </span></a></div>
<div class="tags"><a href="#">A8 <span>B8 </span></a></div>
</div>
Теги span скрыты силами css и отображается только текст А ссылки. Необходимо чтобы при клике по одной из ссылок текст A подменялся текстом В из своего скрытого тега span. К примеру - А1 на В1, А2 на В2 и т.д. При повторном клике - возвращался обратно. На самом деле ссылок около сотни. Поэтому применим только скрипт, который сможет обрабатывать любой блок div, в какой угодно последовательности. Как это можно реализовать?
Для наглядности - скриншот:
Заранее большое спасибо!..