Hello everyone, I have this function that toggles between two CSS classes and shows/hide div content on an html page.

I want to have this function to work on multiple divs, but I do not know how to expand the function. Currently the div holding the more content is called: moreContent.

What I have done is create individual function for each instance that I want to call it on a specific div.

Example: Lets say I have 5 articles on a page. I want to add a button under each article that show/hide the more div. Currently I have only on and to put it on all 5 I have to duplicate the function and change the names
of the classes.

Here is the code:

Code:
<script type="text/javascript">
$(document).ready(function() {
$('.readMore').click(function(){
    $(this).toggleClass('readLess');
    $('.moreContent').toggle();
}); 
});
</script>