Fade in and fade out / element opacity in scroll [jQuery]

I have a one site with 9 sections and each one has a div with the content.

I need the opacity of this content to be reduced to 0 in the scrollTop, so there is no conflict between the transparent nav and the text.

For the moment, in the code I'm using, the first text performs the desired action, but the following text does not.

<!-- FIRST -->

    <div id="inicio" class="full first-section bgParallax" data-speed="0">
            <div class="content container div-content">
            <!-- Begin page content -->
            <div class="col-md-6 logo-bg">
                <h4 class="logotexto vermelho">NOME <strong> marca</strong>
                </h4>
            </div>
            <div>

                <div class="col-md-6 texto texto1">
                    <?php the_field('texto1')?>
                </div>
          </div></div>
            <!-- CONTENT -->
        </div>
        <!-- First Section -->

jQuery

    jQuery(window).ready(function( $ ) {

    $(".texto1").scroll(function(){
        $("texto1").css("opacity", 1 - $(".texto1").scrollTop() / 200);

      })

    $(".texto2").scroll(function(){
        $("texto2").css("opacity", 1 - $(".texto1").scrollTop() / 200);

      })

    });