JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<div class="wrapp">
  <header class="nav"></header>
</div>

CSS

.wrapp {
  height: 3000px;
}
.nav {
  position: fixed;
  width: 100%;
  height: 80px;
  background-color: #084f70;
  text-align: center;
}
.link {
  display: inline-block;
    font-weight: 500;
    line-height: 1;
    color: #FFFFFF;
    padding: 32px 0;
    text-transform: uppercase;
    text-decoration: none;
}

JavaScript

var element = $('.nav');
	
  $(window).scroll(function() {
	  	var scrollTop = $(window).scrollTop();
      if(scrollTop > 200) {
      		if(element.has('.link').length == 0)
      		element.append('<a href="#" class="link">Купите наш товар</a>')
      } else {
       		 $('.link').remove();
      }
	});