I am working with web components. What is the equivalent of the following code in jquery?

const horizontalMasonry = document.createElement('test-horizontal-masonry');
horizontalMasonry.items = [
    {
        id: `0`,
        url: "https://homepages.cae.wisc.edu/~ece533/images/watch.png",
        isPremium: false,
        alt: 'Thumbnail'
    },
    {
        id: `1`,
        url: "https://homepages.cae.wisc.edu/~ece533/images/baboon.png",
        isPremium: true,
        alt: 'Thumbnail'
    },
    {
        id: `2`,
        url: "https://homepages.cae.wisc.edu/~ece533/images/cat.png",
        isPremium: true,
        alt: 'Thumbnail'
    }
];

horizontalMasonry.addEventListener('THUMBNAIL_CLICK_EVENT', () => {
    // e.detail.item
});

document.body.appendChild(horizontalMasonry);

I tried

        $masonry = $('<theo-horizontal-masonry rows="1"></theo-horizontal-masonry>');
        $masonry.items = items;
        $masonry.width = 256;
        $masonry.height = 100;
        $carousel.append($masonry);

but the element is not retaining the properties items, width, height.