How can I apply infinite scrooll to an inner page div?

I realize that scrool only works well when applied to the body of the page, unfortunately this does not solve our problem. In my page there are 2 fixed columns, the right column is content, the left column is a list of the last posts, when we click on a title from the left list, the content of the post is loaded in the right div, I need to apply scrooll infinite in the left div, how can I adjust this?

My layout can be seen in the image below

Imagem

My HTML

<!-- Main Content -->
<main class="main">
<div class="sistema-full-container">
	<div id="master-content">		

		<div id="feed-preview" class="scrollbar">
				CONTENT HERE
		</div>
		<div id="feed-conteudo" class="scrollbar">   
		   <div class="timeline">
				LIST
		   </div>

		</div>
		
	</div>
</div>		
</main><!-- ./Main Content -->