JSFiddle - React, Tailwind, and code Playground
HTML
<div id="questionnaire"></div>
JavaScript
var json = '[{"id":"cat1","title":"title1","conditional":false,"questions":[{"id":"q1a","title":"question"},{"id":"q1b","title":"question"},{"id":"q1c","title":"question"},{"id":"q1d","title":"question"},{"id":"q1e","title":"question"},{"id":"q1f","title":"question"},{"id":"q1g","title":"question"}]},{"id":"cat2","title":"title2","conditional":false,"questions":[{"id":"q2a","title":"question"},{"id":"q2b","title":"question"}]},{"id":"cat3","title":"title","conditional":true,"questions":[{"id":"q3a","title":"question"},{"id":"q3b","title":"question"},{"id":"q3c","title":"question"},{"id":"q3d","title":"question"}]}]';
var data = JSON.parse(json);
$.each(data, function(categoryIndex, category) {
var ul = $('<ul />');
$.each(category.questions, function(questionIndex, question) {
ul.append( $('<li />', {text: question.title}) );
});
$("div#questionnaire").append(ul);
});