Display the contents of a text-based file on a page using jQuery

display-file-contents.html

<p>Get the contents of <code>/wp-content/themes/webguard-ra-theme/sass/typography/_font-size.scss</code></p>

<pre class="has-small-font-size" id="myelement"></pre>
Using this code: 
<pre class="has-small-font-size">
$( document ).ready(function() {  
  jQuery.get("/wp-content/themes/webguard-ra-theme/sass/typography/_font-size.scss", undefined, function(data) {
    $('#myelement').append(data);
  }, "html");
});</pre>


<script>
$( document ).ready(function() {  
  jQuery.get("/wp-content/themes/webguard-ra-theme/sass/typography/_font-size.scss", undefined, function(data) {
    $('#myelement').append(data);
  }, "html");
});
</script>