[CraftLawrence]

Уже 5ый час ищу решение, может вы подскажете.
Делаю что-то вроде самых обыкновенных табов (пример). И это собственно получилось без проблем, пока не стала задача вместе с выбором таба чтобы далеко внизу странички менялась форма в зависимости от выбранного таба.

Вот пример кода, с помощью которого были реализованы обычные табы. Но я не могу использовать id="tab1" еще и внизу для форм. Перекопал кучу гулостраничек - везде сухо. Подскажите хотя бы в какой стороне смотреть?

JS:

jQuery(document).ready(function() {
    jQuery('.tabs .tab-links a').on('click', function(e)  {
        var currentAttrValue = jQuery(this).attr('href');
 
        // Show/Hide Tabs
        jQuery('.tabs ' + currentAttrValue).show().siblings().hide();
 
        // Change/remove current tab to active
        jQuery(this).parent('li').addClass('active').siblings().removeClass('active');
 
        e.preventDefault();
    });
});

HTML:

<div class="tabs">
    <ul class="tab-links">
        <li class="active"><a href="#tab1">Tab #1</a></li>
        <li><a href="#tab2">Tab #2</a></li>
        
    </ul>
 
    <div class="tab-content">
        <div id="tab1" class="tab active">Контент 1</div>
 
        <div id="tab2" class="tab">Контент 2</div>
    </div>
</div>