Compound Interest Calculator<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n margin: 0px;\n padding: 0;\n background-color: #f4f4f9;\n color: #333;\n }\n h1 {\n text-align: center;\n margin-bottom: 20px;\n }\n .calculator {\n max-width: 600px;\n margin: 0 auto;\n padding: 20px;\n background-color: #fff;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n border-radius: 8px;\n }\n .form-group {\n margin-bottom: 15px;\n }\n label {\n display: block;\n margin-bottom: 5px;\n }\n input {\n width: 100%;\n padding: 8px;\n box-sizing: border-box;\n border: 1px solid #ddd;\n border-radius: 4px;\n }\n button {\n width: 100%;\n padding: 10px;\n background-color: #0078d4;\n color: #fff;\n border: none;\n border-radius: 4px;\n font-size: 16px;\n cursor: pointer;\n }\n button:hover {\n background-color: #005bb5;\n }\n .result {\n margin-top: 20px;\n padding: 10px;\n background-color: #EBDBFF;\n border: 1px solid #b3d4fc;\n border-radius: 4px;\n }\n table {\n width: 100%;\n border-collapse: collapse;\n margin-top: 20px;\n }\n th, td {\n border: 1px solid #ddd;\n padding: 8px;\n text-align: center;\n }\n th {\n background-color: #512888;\n color: white;\n }\n tr:nth-child(even) {\n background-color: #f9f9f9;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"calculator\">\n <div class=\"form-group\">\n <label for=\"startingAmount\">Starting Amount ($):<\/label>\n <input type=\"number\" id=\"startingAmount\" value=\"5000\" placeholder=\"Enter starting amount\">\n <\/div>\n <div class=\"form-group\">\n <label for=\"monthlyContribution\">Monthly Contribution ($):<\/label>\n <input type=\"number\" id=\"monthlyContribution\" value=\"100\" placeholder=\"Enter monthly contribution\">\n <\/div>\n <div class=\"form-group\">\n <label for=\"roi\">Expected ROI (%):<\/label>\n <input type=\"number\" id=\"roi\" value=\"8\" placeholder=\"Enter expected ROI\">\n <\/div>\n <div class=\"form-group\">\n <label for=\"years\">Years to Grow:<\/label>\n <input type=\"number\" id=\"years\" value=\"30\" placeholder=\"Enter years to grow\">\n <\/div>\n <button onclick=\"generateTable()\">Calculate<\/button>\n <div class=\"result\" id=\"result\" style=\"display: none;\">\n <table>\n <thead>\n <tr>\n <th>YEAR<\/th>\n <th>TOTAL CONTRIBUTION<\/th>\n <th>TOTAL AMOUNT<\/th>\n <th>ROI<\/th>\n <th>FUTURE VALUE<\/th>\n <\/tr>\n <\/thead>\n <tbody id=\"resultTableBody\"><\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n <script>\n function generateTable() {\n const startingAmount = parseFloat(document.getElementById('startingAmount').value);\n const monthlyContribution = parseFloat(document.getElementById('monthlyContribution').value);\n const roi = parseFloat(document.getElementById('roi').value) \/ 100;\n const years = parseInt(document.getElementById('years').value);\n\n if (isNaN(startingAmount) || isNaN(monthlyContribution) || isNaN(roi) || isNaN(years)) {\n alert('Please enter valid numbers in all fields.');\n return;\n }\n\n const resultDiv = document.getElementById('result');\n const tableBody = document.getElementById('resultTableBody');\n tableBody.innerHTML = '';\n resultDiv.style.display = 'block';\n\n let totalAmount = startingAmount; \/\/ Initial total amount (Starting Amount)\n\n for (let i = 1; i <= years; i++) {\n const annualContribution = monthlyContribution * 12; \/\/ Contribution for the year\n totalAmount += annualContribution; \/\/ Add contribution to total amount\n\n const roiAmount = totalAmount * roi; \/\/ Calculate ROI based on total amount\n const futureValue = totalAmount + roiAmount; \/\/ Future value includes ROI\n\n const row = document.createElement('tr');\n row.innerHTML = `\n <td>${2024 + i - 1}<\/td>\n <td>${formatNumber(annualContribution)}<\/td>\n <td>${formatNumber(totalAmount)}<\/td>\n <td>${formatNumber(roiAmount)}<\/td>\n <td>${formatNumber(futureValue)}<\/td>\n `;\n\n tableBody.appendChild(row);\n totalAmount = futureValue; \/\/ Update total amount for the next year\n }\n }\n\n function formatNumber(number) {\n return number.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });\n }\n <\/script>\n\n<\/body>\n<\/html>\n\n <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Use our compound returns calculator to see how your savings or investments might grow over time using the power of compound interest<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-1137","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/ddnk.ai\/ms\/wp-json\/wp\/v2\/pages\/1137","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ddnk.ai\/ms\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ddnk.ai\/ms\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ddnk.ai\/ms\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ddnk.ai\/ms\/wp-json\/wp\/v2\/comments?post=1137"}],"version-history":[{"count":7,"href":"https:\/\/ddnk.ai\/ms\/wp-json\/wp\/v2\/pages\/1137\/revisions"}],"predecessor-version":[{"id":1144,"href":"https:\/\/ddnk.ai\/ms\/wp-json\/wp\/v2\/pages\/1137\/revisions\/1144"}],"wp:attachment":[{"href":"https:\/\/ddnk.ai\/ms\/wp-json\/wp\/v2\/media?parent=1137"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}