How to call jQuery with button - html

Question

I am editing a website that is automated with java, I am creating a menu to hide few divs that are repated with same id and same class. I managed to do it already with jQuery with this:
$(document).ready(function () {
$('[id]').each(function () {
var ids = $('[id=catalog_container' + this.id + ']');
if (ids.length > 1 && ids[0] == this) {
$(ids[0]).remove();
}
});
});
I need to do it in another way, but I don't know how to do it. I want to do it with button.
<li><a><button onclick="myFunction()">1 Catalog</button></a></li>
Something like that, when I press that button, to remove first duplicated id, when I press another button to remove second duplicated ID, and so on.
Help me please.
I'd like to know how to do it like this too: not to load script automatically as it does, I want to know how to call it.

Answer 1

I managed to find a solution, I will post it for anyone to see it, and give feedback if you want!
<!-- Hide second id -->
$(document).ready(function () {
$("#Catalog").click(function () {
$('[id]').each(function () {
var ids = $('[id=' + this.id + ']');
if (ids.length > 1 && 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 && 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 && 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 && 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>