Isotope in SharePoint

<!-- isotope CSS-->
<link rel='stylesheet' type='text/css' href='/_catalogs/masterpage/isotope-style.css'></link>

<!-- JQuery-->
<script type='text/javascript' src='/_catalogs/masterpage/jquery-1.7.1.min.js'></script>

<!-- isotope script -->
<script type='text/javascript' src='/_catalogs/masterpage/jquery.isotope.min.js'></script>

<!-- isotope HTML-->
<div id="container">
    <div class="element other nonmetal" data-symbol="H" data-category="other">
      <p class="number">1</p>
      <h3 class="symbol">H</h3>
      <h2 class="name">Hydrogen</h2>
      <p class="weight">1.00794</p>
    </div>
</div>

<!-- isotope startup script-->
<script type='text/javascript'>
$(function(){
      var $container = $('#container');
      $container.isotope({
        itemSelector: '.element'
      });
    });
</script>