JSFiddle - React, Tailwind, and code Playground

by rikazavr

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<a href="#" id="1" class="task">Task</a>
<a href="#" id="2" class="task">Task</a>
<a href="#" id="3" class="task">Task</a>
<a href="#" id="4" class="task">Task</a>
<a href="#" id="5" class="task">Task</a>

CSS

.task {
  display: block;
  margin: 5px auto;
  width: 400px;
  color: #000;
  border: 1px solid;
}

JavaScript

function setCookie(name, value, options = {}) {
	options = {
    path: '/',
    // при необходимости добавьте другие значения по умолчанию
    ...options
  };

  let updatedCookie = encodeURIComponent(name) + "=" + encodeURIComponent(value);

  for (let optionKey in options) {
    updatedCookie += "; " + optionKey;
    let optionValue = options[optionKey];
    if (optionValue !== true) {
      updatedCookie += "=" + optionValue;
    }
  }
  
  document.cookie = updatedCookie;
  
  console.log( document.cookie );
}

$('.task').click(function(e){

  setCookie('taskId', this.id, {secure: true, 'max-age': 3600});
  
})