JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<input type="checkbox" id="darkMode" name="">

CSS

body.dark-mode {
  background-color: #000;
}

JavaScript

var ele = 'body';

$(document).ready(function() {
  if ($.cookie('darkMode')) {
    $(ele).addClass('dark-mode');
    $('#darkMode').prop('checked', true)
  }
});

$('#darkMode').on('click', function() {

  if ($('#darkMode').prop('checked')) {

    $(ele).addClass('dark-mode');

    // here i wanna save the value of darkMode in browser 
    $.cookie('darkMode', 'dark', {
      expires: 7,
      path: '/'
    });

  } else {

    $(ele).removeClass('dark-mode');
    $.removeCookie('darkMode', {
      path: '/'
    });
  }

});