diff --git a/solutions/dom_manipulation/1/1.css b/solutions/dom_manipulation/1/1.css
new file mode 100644
index 0000000..e15e793
--- /dev/null
+++ b/solutions/dom_manipulation/1/1.css
@@ -0,0 +1,23 @@
+*{
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+body{
+ width: 100vw;
+ height: 100vh;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+button{
+ width: 7rem;
+ height: 3rem;
+ color: #fff;
+ background-color: red;
+ border-radius: 30px;
+ outline: none;
+ border: none;
+ cursor: pointer;
+ font-size: 1.3rem;
+}
\ No newline at end of file
diff --git a/solutions/dom_manipulation/1/1.html b/solutions/dom_manipulation/1/1.html
new file mode 100644
index 0000000..32dfc89
--- /dev/null
+++ b/solutions/dom_manipulation/1/1.html
@@ -0,0 +1,14 @@
+
+
+
+
+
+ Dom manipulation 1st challenge
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/solutions/dom_manipulation/1/1.js b/solutions/dom_manipulation/1/1.js
new file mode 100644
index 0000000..3f3cda1
--- /dev/null
+++ b/solutions/dom_manipulation/1/1.js
@@ -0,0 +1,18 @@
+const button = document.querySelector("button");
+
+button.addEventListener("click", () => {
+ if (button.innerHTML === "Save") {
+ button.innerText = "Saved";
+ button.style.backgroundColor = "#000";
+ removeSaved();
+ } else {
+ removeSaved();
+ }
+});
+
+function removeSaved() {
+ setTimeout(() => {
+ button.innerText = "Save";
+ button.style.backgroundColor = "red";
+ }, 2000);
+}