Bank Account Class Logic

This snippet manages balances, transaction history, and security PINs.

By Aman KureshiDec 18, 2025 (Dec 18, 2025)

Bank Account Class Logic

javascript

<!DOCTYPE html>
<html>
<head>
    <title>Simple JS Task Manager</title>
    <style>
        body { font-family: sans-serif; display: flex; justify-content: center; padding: 50px; background: #f4f4f9; }
        .container { background: white; padding: 2rem; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); width: 300px; }
        h2 { margin-top: 0; color: #333; }
        input { width: 70%; padding: 8px; border: 1px solid #ddd; border-radius: 4px; }
        button { padding: 8px; cursor: pointer; background: #28a745; color: white; border: none; border-radius: 4px; }
        ul { list-style: none; padding: 0; margin-top: 20px; }
        li { background: #eee; margin-bottom: 5px; padding: 10px; display: flex; justify-content: space-between; align-items: center; border-radius: 4px; }
        .delete-btn { background: #dc3545; padding: 2px 8px; font-size: 12px; }
    </style>
</head>
<body>

<div class="container">
    <h2>My Tasks</h2>
    <input type="text" id="taskInput" placeholder="Add a new task...">
    <button onclick="addTask()">Add</button>
    <ul id="taskList"></ul>
</div>

<script>
    // 1. SELECT ELEMENTS
    const input = document.getElementById('taskInput');
    const list = document.getElementById('taskList');

    // 2. DEFINE THE ACTION
    function addTask() {
        const taskText = input.value;

        // Validation: Don't add empty tasks
        if (taskText === '') {
            alert("Please enter a task!");
            return;
        }

        // Create the List Item (li)
        const li = document.createElement('li');
        li.innerHTML = `
            ${taskText} 
            <button class="delete-btn" onclick="removeTask(this)">X</button>
        `;

        // Add to the list and clear input
        list.appendChild(li);
        input.value = '';
    }

    // 3. DEFINE THE DELETE ACTION
    function removeTask(button) {
        const itemToRemove = button.parentElement;
        list.removeChild(itemToRemove);
    }

    // Optional: Allow pressing "Enter" to add task
    input.addEventListener("keypress", function(event) {
        if (event.key === "Enter") {
            addTask();
        }
    });
</script>

</body>
</html>

Views

Lines

Characters

2,207

Likes

Details

Language: Javascript
Created: Dec 18, 2025
Updated: Dec 18, 2025
Size: 2.2 KB

Build your snippet library

Join thousands of developers organizing and sharing code snippets.