Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+ const calculateBtn = document.getElementById('calculateBtn');
+ calculateBtn.addEventListener('click', calculateComparison);
+
+ // Set up initial calculation
+ calculateComparison();
+ });
+
+ function calculateComparison() {
+ const inputs = {
+ homePrice: getInputValue('homePrice'),
+ downPayment: getInputValue('downPayment') / 100,
+ mortgageRate: getInputValue('mortgageRate') / 100,
+ propertyTax: getInputValue('propertyTax') / 100,
+ maintenance: getInputValue('maintenance') / 100,
+ homeInsurance: getInputValue('homeInsurance'),
+ hoaFees: getInputValue('hoaFees'),
+ monthlyRent: getInputValue('monthlyRent'),
+ rentIncrease: getInputValue('rentIncrease') / 100,
+ rentersInsurance: getInputValue('rentersInsurance'),
+ investmentReturn: getInputValue('investmentReturn') / 100,
+ inflationRate: getInputValue('inflationRate') / 100,
+ taxBracket: getInputValue('taxBracket') / 100,
+ timeHorizon: getInputValue('timeHorizon')
+ };
+
+ const results = calculateScenarios(inputs);
+ updateUI(results);
+ }
+
+ function getInputValue(id) {
+ return parseFloat(document.getElementById(id).value);
+ }
+
+ function calculateScenarios(inputs) {
+ const loanAmount = inputs.homePrice * (1 - inputs.downPayment);
+ const monthlyMortgageRate = inputs.mortgageRate / 12;
+ const numberOfPayments = inputs.timeHorizon * 12;
+
+ // Calculate monthly mortgage payment using PMT formula
+ const monthlyMortgage = loanAmount * (monthlyMortgageRate * Math.pow(1 + monthlyMortgageRate, numberOfPayments)) /
+ (Math.pow(1 + monthlyMortgageRate, numberOfPayments) - 1);
+
+ const monthlyPropertyTax = (inputs.homePrice * inputs.propertyTax) / 12;
+ const monthlyMaintenance = (inputs.homePrice * inputs.maintenance) / 12;
+ const monthlyHomeInsurance = inputs.homeInsurance / 12;
+ const totalMonthlyBuying = monthlyMortgage + monthlyPropertyTax + monthlyMaintenance +
+ monthlyHomeInsurance + inputs.hoaFees;
+
+ let buyingNetWorth = [];
+ let rentingNetWorth = [];
+ let buyingMonthlyCosts = [];
+ let rentingMonthlyCosts = [];
+
+ let currentRent = inputs.monthlyRent;
+ let homeValue = inputs.homePrice;
+ let loanBalance = loanAmount;
+ let investmentBalance = inputs.homePrice * inputs.downPayment;
+
+ for (let year = 0; year <= inputs.timeHorizon; year++) {
+ // Calculate buying scenario
+ const equity = homeValue - loanBalance;
+ buyingNetWorth.push(equity + investmentBalance);
+ buyingMonthlyCosts.push(totalMonthlyBuying);
+
+ // Calculate renting scenario
+ const rentingInvestmentBalance = investmentBalance * Math.pow(1 + inputs.investmentReturn, year);
+ rentingNetWorth.push(rentingInvestmentBalance);
+ rentingMonthlyCosts.push(currentRent + inputs.rentersInsurance / 12);
+
+ // Update values for next year
+ homeValue *= (1 + inputs.inflationRate);
+ currentRent *= (1 + inputs.rentIncrease);
+ loanBalance = calculateRemainingLoanBalance(loanAmount, inputs.mortgageRate, year, inputs.timeHorizon);
+ }
+
+ return {
+ buyingNetWorth,
+ rentingNetWorth,
+ buyingMonthlyCosts,
+ rentingMonthlyCosts
+ };
+ }
+
+ function calculateRemainingLoanBalance(principal, rate, currentYear, totalYears) {
+ const monthlyRate = rate / 12;
+ const totalMonths = totalYears * 12;
+ const monthlyPayment = principal * (monthlyRate * Math.pow(1 + monthlyRate, totalMonths)) /
+ (Math.pow(1 + monthlyRate, totalMonths) - 1);
+ const remainingMonths = (totalYears - currentYear) * 12;
+
+ return (monthlyPayment * (Math.pow(1 + monthlyRate, remainingMonths) - 1)) /
+ (monthlyRate * Math.pow(1 + monthlyRate, remainingMonths));
+ }
+
+ function updateUI(results) {
+ const buyingScenario = document.getElementById('buyingScenario');
+ const rentingScenario = document.getElementById('rentingScenario');
+
+ const finalBuyingNetWorth = results.buyingNetWorth[results.buyingNetWorth.length - 1];
+ const finalRentingNetWorth = results.rentingNetWorth[results.rentingNetWorth.length - 1];
+
+ buyingScenario.innerHTML = `
+
Buying Scenario
+
Final Net Worth: $${formatNumber(finalBuyingNetWorth)}
+
Monthly Payment: $${formatNumber(results.buyingMonthlyCosts[0])}
+ `;
+
+ rentingScenario.innerHTML = `
+
Renting Scenario
+
Final Net Worth: $${formatNumber(finalRentingNetWorth)}
+
Monthly Payment: $${formatNumber(results.rentingMonthlyCosts[0])}
+ `;
+
+ // Update charts if using a charting library
+ }
+
+ function formatNumber(number) {
+ return Math.round(number).toLocaleString();
+ }