How do I convert this to j query

Question

0.00/5 (No votes)

See more:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Awesome To-Do List HTML,CSS & JavaScript</title>
  <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
  <link rel="stylesheet" href="style.css"> 
</head>
<body>
	<div class="container">
		<div class="addTask">
			<input type="text" placeholder="Add a Task">
			<button>Add</button>
		</div>

		<ol class="notCompleted">
			<h3>Not Completed</h3>
		</ol>

		<ol class="Completed">
			<h3>Completed</h3>
		</ol>
	</div>

	<script>
		const input = document.querySelector('input');z
		const btn = document.querySelector('.addTask > button');

		btn.addEventListener('click', addList);
		input.addEventListener('keyup', (e)=>{
			(e.keyCode === 13 ? addList(e) : null);
		})

		function addList(e){
			const notCompleted = document.querySelector('.notCompleted');
			const Completed = document.querySelector('.Completed');

			const newLi = document.createElement('li');
			const checkBtn = document.createElement('button');
			const delBtn = document.createElement('button');

			checkBtn.innerHTML = '';
			delBtn.innerHTML = '^__i class="fa fa-trash">';


			if(input.value !==''){
				newLi.textContent = input.value;
				input.value = '';
				notCompleted.appendChild(newLi);
				newLi.appendChild(checkBtn);
				newLi.appendChild(delBtn);
			}

			checkBtn.addEventListener('click', function(){
				const parent = this.parentNode;
				parent.remove();
				Completed.appendChild(parent);
				checkBtn.style.display = 'none';
			});

			delBtn.addEventListener('click', function(){
				const parent = this.parentNode;
				parent.remove();
			});
		}

	</script>
</body>
</html>

What I have tried:

 const notCompleted =$('ntdone');
const Completed = $('.completed');   
const newLi = $('<li></li>');
const checkBtn = $('<button></button');
const delBtn = $('<button></button');

checkBtn.innerHTML = '';
			delBtn.innerHTML = '^__i class="fa fa-trash">';


			if(input.value !==''){
				newLi.text = input.value;
				input.value = '';
				notCompleted.appendTo(newLi);
				newLi.appendTo(checkBtn);
				newLi.appendTo(delBtn);
			}

			checkBtn.addEventListener('click', function(){
				const parent = this.parentNode;
				parent.remove();
				Completed.appendTo(parent);
				checkBtn.style.display = 'none';
			});

			delBtn.addEventListener('click', function(){
				const parent = this.parentNode;
				parent.remove();
			});
		}

Posted 9-Apr-22 4:01am

User 15559029

Updated 9-Apr-22 6:08am

Add a Solution

1 solution

Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Dave Kreskowiak · Answer 1 · 2022-04-09T06:08:00

There is no "conversion" to jQuery. It's not a language. jQuery is a library of modules, written in javascript, designed to make writing common functionality in javascript simpler, smaller, and more supportable.

Is there something in jQuery that will do what your code is doing? What is your code supposed to be doing?

How do I convert this to j query

1 solution

Solution 1

Add your solution here

Preview 0

How do I convert this to j query

1 solution

Solution 1

Add your solution here

Preview 0

Existing Members

...or Join us