Блог

Я редактирую веб-сайт, который автоматизирован с помощью Java, я создаю меню, чтобы скрыть несколько разделов, которые повторяются с тем же идентификатором и тем же классом. Мне уже удалось сделать это с помощью jQuery с помощью этого:

      $(document).ready(function () {
        $('[id]').each(function () {
            var ids = $('[id=catalog_container'   this.id   ']');
            if (ids.length > 1 amp;amp; ids[0] == this) {
                $(ids[0]).remove();
            }
        });
    });
  

Мне нужно сделать это по-другому, но я не знаю, как это сделать. Я хочу сделать это с помощью кнопки.
<li><a><button onclick="myFunction()">1 Catalog</button></a></li>
Что-то вроде этого, когда я нажимаю эту кнопку, чтобы удалить первый дублированный идентификатор, когда я нажимаю другую кнопку, чтобы удалить второй дублированный идентификатор, и так далее.
Помогите мне, пожалуйста.
Я тоже хотел бы знать, как это сделать: не загружать скрипт автоматически, как это происходит, я хочу знать, как его вызвать.

Мне удалось найти решение, я опубликую его, чтобы все могли его увидеть, и оставлю отзыв, если хотите!

 <!-- Hide second id -->
         $(document).ready(function () {
           $("#Catalog").click(function () {
            $('[id]').each(function () {
                var ids = $('[id='   this.id   ']');
                if (ids.length > 1 amp;amp; ids[0] == this) {
                    $(ids[1]).hide(); 
                    $(ids[0]).show(); 
                } 
                });
            });
        });

         $(document).ready(function () {
           $("#Catalog2").click(function () {
            $('[id]').each(function () {
                var ids = $('[id='   this.id   ']');
                if (ids.length > 1 amp;amp; ids[0] == this) {
                    $(ids[0]).hide(); 
                    $(ids[1]).show(); 
                } 
                });
            });
        });

<!-- Hide First ID -->

         $(document).ready(function () {
           $("#Catalog").click(function () {
            $('[class]').each(function () {
                var ids = $('[class=category-title'   this.id   ']');
                if (ids.length > 1 amp;amp; ids[0] == this) {
                    $(ids[1]).hide(); 
                    $(ids[0]).show(); 
                } 
                });
            });
        });

         $(document).ready(function () {
           $("#Catalog2").click(function () {
            $('[class]').each(function () {
                var ids = $('[class=category-title'   this.id   ']');
                if (ids.length > 1 amp;amp; ids[0] == this) {
                    $(ids[0]).hide(); 
                    $(ids[1]).show(); 
                } 
                });
            });
        });
  

          <ul>
             <li><a><button style="color:black;" id="Catalog">1 Catalog</button></a></li>
             <li><a><button style="color:black;" id="Catalog2">2 Catalog</button></a></li>
        </ul>