JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/noUiSlider/5.0.0/jquery.nouislider.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/noUiSlider/5.0.0/jquery.nouislider.min.js"></script>
<div id="slider1"></div>
<input type="text" class="min-sqrft1"/>
<span class="max-sqrft1"></span>

JavaScript

$(function(){
    $('#slider1').noUiSlider({
       range: [0,8000]
      ,start: [1000,7000]
      ,step: 10
      ,connect: true
      ,serialization: {
         mark: ','
        ,resolution: 1
        ,to: [
          ['ctl00$mainContent$txtSqrFeetMIN', [$('.min-sqrft1'), 'val']],
          ['ctl00$mainContent$txtSqrFeetMAX', [$('.max-sqrft1'), 'html']]
          ]
      }
    });
});