diff --git a/jekyll-code-tabs.gemspec b/jekyll-code-tabs.gemspec
index 2b2b5c6..376ebc0 100644
--- a/jekyll-code-tabs.gemspec
+++ b/jekyll-code-tabs.gemspec
@@ -12,7 +12,7 @@ Gem::Specification.new do |spec|
   spec.licenses      = ["MIT"]
   spec.files         = `git ls-files -z`.split("\x0").reject { |f| f.match(%r!^(test|spec|features)/!)  }
   spec.require_paths = ["lib"]
-  spec.add_dependency "jekyll", "~> 3.0"
+  spec.add_dependency "jekyll", "~> 4.0"
   spec.add_development_dependency "rake", "~> 11.0"
   spec.add_development_dependency "rspec", "~> 3.5"
   spec.add_development_dependency "rubocop", "~> 0.52"
diff --git a/lib/jekyll-code-tabs.rb b/lib/jekyll-code-tabs.rb
index f0b684f..51e78ef 100644
--- a/lib/jekyll-code-tabs.rb
+++ b/lib/jekyll-code-tabs.rb
@@ -12,17 +12,19 @@ def render(context)
 
         uuid = SecureRandom.uuid
 				template = ERB.new <<-EOF
-<ul class="uk-tab" data-uk-switcher="{connect:'#<%= uuid %>'}">
-<% environment['codetabs'].each_with_index do |(key, _), index| %>
-	<li<%= index == 0 ? ' class="uk-active"' : ''%>><a href="#"><%= key %></a></li>
-<% end %>
-</ul>
+<!-- Tab links -->
+<div class="tab">
+  <% environment['codetabs'].each_with_index do |(key, _), index| %> 
+    <button class="tablinks" id="<%= index == 0 ? 'default' : '' %>" onclick="showTab(event, '<%= key %>')"><%= key %></button>
+  <% end %>
+</div>
 
-<ul id="<%= uuid %>" class="uk-switcher uk-margin">
-<% environment['codetabs'].each do |_, value| %>
-	<li><%= value %></li>
+<!-- Tab content -->
+<% environment['codetabs'].each do |key, value| %>
+<div id="<%= key %>" class="tabcontent">
+  <%= value %>
+</div>
 <% end %>
-</ul>
 EOF
 				template.result(binding)
       end