Instead of a defining journalEntries as a string define it as an array and push the JSX elements to the array in order to render, for example:
populateJournal() {
const j = Object.values(this.state.journal);
var journalEntries = [];
for (var i = 0; i < j.length; i++) {
journalEntries.push(
<div>
<h3>{j[i].title} - {j[i].date}</h3>
<p>{j[i].entry}</p>
</div>
);
}
return (<div>{journalEntries}</div>);
}
When you append to the string, you are not actually appending a string but an object which is incorrect and hence you get [object Object]
You can also use map to render your context. See this answer on how to use map:
REACT JS: Map over an array of objects to render in JSX