JSFiddle - React, Tailwind, and code Playground

HTML

Without <i>pushStack</i>
<ul>
    <li id="1">1</li>
    <li class="a">2</li>
    <li class="a">3</li>
</ul>
<br /><br /><br />
With <i>pushStack</i>
<ul>
    <li id="2">1</li>
    <li class="b">2</li>
    <li class="b">3</li>
</ul>

CSS

.colorRed {
    color: red;
}

.fontWeightBold {
    font-weight: bold;
}

JavaScript

$.fn.agregate = function(newCollection) {
    return this.pushStack(this.add(newCollection), "agregate", "");
};


var collectionA = $("#1");

collectionA
    .add($(".a"))
        .addClass("colorRed")
        .end()
    .addClass("fontWeightBold");



var collectionB = $("#2")
collectionB
    .agregate($(".b"))
        .addClass("colorRed")
        .end()
    .addClass("fontWeightBold");