diff --git a/index.html b/index.html
index 3548fdd..4b3edf2 100644
--- a/index.html
+++ b/index.html
@@ -58,7 +58,7 @@ <h3><a href="https://github.com/elixir-circuits/circuits_uart">UART</a></h3>
     <div class="container section content js-hex-query-component query-component">
      <h2 class="header h2 text center">What uses Elixir Circuits?</h2>
 
-      <div class="js-hex-search-avalibale-libraries avalibale-libraries-list"></div>
+      <div class="js-hex-search-available-libraries available-libraries-list"></div>
     </div>
      <footer>
        <a class="icon" href="https://github.com/elixir-circuits"><i class="fab fa-github"></i></a>
diff --git a/index.js b/index.js
index 5133c87..d0516e9 100644
--- a/index.js
+++ b/index.js
@@ -2,7 +2,7 @@
 
 var hexSearch = {
   state: {
-    avaliableLibrariesDom: document.querySelector(".js-hex-search-avalibale-libraries"),
+    availableLibrariesDom: document.querySelector(".js-hex-search-available-libraries"),
     i2cLibraries: [],
     spiLibraries: [],
     gpioLibraries: [],
@@ -108,7 +108,7 @@ var hexSearch = {
       ul.appendChild(li);
     }
 
-    state.avaliableLibrariesDom.appendChild(ul);
+    state.availableLibrariesDom.appendChild(ul);
   },
 
   buildLibListItem: function (lib, protocol) {
diff --git a/styles.css b/styles.css
index 974d37b..1aa883b 100644
--- a/styles.css
+++ b/styles.css
@@ -194,7 +194,7 @@ ul {
   font-size: .75rem;
 }
 
-.avalibale-libraries-list {
+.available-libraries-list {
   text-align: center;
   padding: 15px;
 }