JSFiddle - React, Tailwind, and code Playground

HTML

<div id="productListView" />

CSS

.salePrice { margin-top:3px;margin-bottom:0px;color:#75a8db; }
.salePrice span.original { text-decoration: line-through;font-size:small; }
.salePrice span.discount { color:#75a8db; }

JavaScript

var items = [],
    filterValue = "",
    brand = "",
    sport = "",
    category = "",
    productListView = $("#productListView"),
    catalog = {
        products: [
            {
            name: "Shoes",
            brand: "Nike",
            sport: "running",
            salePrice: "40",
            price: "80"}]
    };

$.each(catalog.products, function(index, value) {

    if (((!filterValue) || value.name.toUpperCase().indexOf(filterValue.toUpperCase()) != -1) && ((!brand) || value.brand.toUpperCase().indexOf(brand.toUpperCase()) != -1) && ((!category) || value.category.toUpperCase().indexOf(category.toUpperCase()) != -1) && ((!sport) || value.sport.toUpperCase().indexOf(sport.toUpperCase()) != -1)) {

        var priceInfo = value.salePrice === '' ? $("<h4 class='price'>$" + value.price + "</h4>") : $("<h4 class='salePrice'><span class='original'>$" + value.price + "</span><span class='discount'>$" + value.salePrice + "</span></span></h4>"),
            listItem = $("<li id=" + index + "/>"),
            itemLink = $("<a data-identity='productId' />"),
            itemImg = $("<img class='ui-li-thumb' src='" + value.thumbnail + "'/>"),
            itemBrand = $('<p style="margin-bottom:0px;margin-top:0px;">' + value.brand + '</p>'),
            itemName = $('<h3 style="margin-top:0px;margin-bottom:0px;">' + value.name + '</h3>');

        itemLink.attr("href", "./details.page?productId=" + index);
        itemLink.append(itemImg).append(itemBrand).append(itemName).append(priceInfo);

        // here's the click handler you need
        itemLink.click(function(e) {
            console.log("item clicked");
            if ($(this).data("clickCount") > 0) {
                console.log("click count reached");
                return false;
            }

            console.log("following the link");
            // set a click counter
            $(this).data("clickCount", 1);
            // store the original href in case you need it
           ...