I'm currently working on enhancing a blog feed feature. The script I have opens up a div and displays its content when clicked, but my goal is to have the first div in the feed open automatically when the page loads. Being relatively new to django and javascript/jQuery, I'm struggling to find a solution for this. Any help on how to achieve this would be greatly appreciated.
Everything else on the page works as expected. When the page loads, all divs are closed by default and can be opened individually by clicking on them.
Included below are snippets of code from base.html and tools.js
<article id="entry-{{ object.pk }}" {% if continue_reading %} onclick="toggleArticleActive('entry-{{ object.pk }}', true);" {% endif %}>
...blog post content
</article>
tools.js
function toggleArticleActive(article_dom_id, is_active) {
if (is_active) { // deactivate all that are active
$('.article-active').each(function(index, value) {
toggleArticleActive($(this).attr('id'), false);
});
}
var a = $('#' + article_dom_id);
a.attr("class", is_active ? "article-active" : "");
if (is_active) {
a.find(".show-when-article-active").show(); // can animate, e.g. show('slow')
a.find(".show-when-article-not-active").hide();
// Load questions about this entry in the main div
$('#div_activity').load('/f/?entry=' + article_dom_id.replace('entry-','') );
} else {
a.find(".show-when-article-active").hide();
a.find(".show-when-article-not-active").show();
}
}