JSFiddle - React, Tailwind, and code Playground

by UserNaN

HTML

<div id='container'>
	<div id='title' class='active' data='1'>
		<div id='content'>Content 1</div>
		<div id='description'>Description 1</div>
	</div><div id='container'>
	<div id='title' class='active' data='1'>
		<div id='content'>Content 1</div>
		<div id='description'>Description 1</div>
	</div><div id='container'>
	<div id='title' class='active' data='1'>
		<div id='content'>Content 1</div>
		<div id='description'>Description 1</div>
	</div>
</div>
<div id='save'>Save</div>

CSS

#save {
    cursor: pointer;
    display: inline-block;
    margin: 10px 0;
    padding: 10px;
    color: #fff;
    background: #333;
}

JavaScript

$('#save').click(function() {
    $data = {};
    $('#container').find('#title').each(function($i, $elm) {
        $data[$i] = {
            'content': $(this).find('#content').html(),
            'description': $(this).find('#description').html()
        };
    });
    console.log($data);
});