JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://d1eqzjbvoh1rux.cloudfront.net/json2.min.js"></script>
<div class="list">
    <div class="items" id="item1">
        <div class="itemtitle">Some title</div>
        <div class="icon"><img src="1.jpg"></div>
        <div class="footer1">blah</div>
    </div>
    <div class="items" id="item2">Stuff</div>
    <div class="items" id="item3">Stuff2</div>
    <div class="items" id="itemN">
        <div class="itemtitle">Some other title</div>
        <div class="icon"><img src="2.jpg"></div>
        <div class="footer4">boo</div>
    </div>
</div>

JavaScript

var theData = {};
$(document).ready(function() {
    $(".items").click(function() {
        theData["title"] = $(this).find(".itemtitle").text();
        theData["icon"] = $(this).find(".icon img").attr("src");
        theData["footer"] = $(this).find(".footer" + ($(this).index()+1)).text();
        
        //alert(JSON.stringify(theData));
    
        $.ajax({
            url: "/ajax_json_echo/",
            data: theData,
            type: "POST",
            dataType: "json",
            success: function(data) { alert(JSON.stringify(data)); },
            error: function(x, t, m) { alert("Error: " + t + " :: " + m); }
        });
    });
});