I've tried to use different class names/key names it still won't pull any data to localStorage for the liked2.on("click", saveData).. do I need to incorporate a for loop of some sort so it passes through both buttons?
** note the local storage does work on the liked1.on("click", saveData) **
<form id="form1">
<label>
<h4>Destination One</h4>
<input
type="text"
name="cityName"
placeholder="Enter a destination"
id="input"
/>
</label>
<button type="submit" class="primary button search-button">
search
</button>
<div type="button" class="button button-like" id="liked1">
<i class="fa fa-heart"></i>
</div>
</form> function saveData() {
var cities = document.getElementById("input").value;
localStorage.setItem("list", JSON.stringify(cities));
var savedCity = JSON.parse(localStorage.getItem("list"));
localStorage.setItem("list", JSON.stringify(savedCity));
var result = JSON.parse(localStorage.getItem("list"));
console.log(result);
}
liked1.on("click", saveData);
liked2.on("click", saveData);I can't clearly understand what do you want to do, so I will try my best to answer your question.
Every time you use setItem with the same keyName, it overrides the old one and fill it with the new one.
So you can
keyNames for each form, for example, form1_cityName for the first form and form2_cityName for the second formsetItem, like JSON