diff --git a/src/components/counter.jsx b/src/components/counter.jsx
index 00f78503..dee01c1a 100644
--- a/src/components/counter.jsx
+++ b/src/components/counter.jsx
@@ -52,6 +52,7 @@ class Counter extends Component {
     // let classes = this.getBadgeClasses();
     // console.log("props", this.props);
     console.log("Counter - rendered");
+    const { onDelete, onIncrement } = this.props;
     return (
       <div>
         {/* <h4> {this.props.id}</h4> */}
@@ -59,13 +60,13 @@ class Counter extends Component {
         {/* <span style={this.styles} className="badge badge-primary m-2">{this.formatCount()} </span> */}
         <span className={this.getBadgeClasses()}>{this.formatCount()} </span>
         <button
-          onClick={() => this.props.onIncrement(this.props.counter)}
+          onClick={() => onIncrement(this.props.counter)}
           className="btn badge-secondary btn-sm"
         >
           Increment
         </button>
         <button
-          onClick={() => this.props.onDelete(this.props.counter.id)}
+          onClick={() => onDelete(this.props.counter.id)}
           className="btn btn-danger btn-sm m-2"
         >
           Delete
diff --git a/src/components/counters.jsx b/src/components/counters.jsx
index 8b08023b..b45151f4 100644
--- a/src/components/counters.jsx
+++ b/src/components/counters.jsx
@@ -39,7 +39,6 @@ class Counters extends Component {
     console.log("Counters - rendered");
     const { onReset, onDelete, onIncrement } = this.props; // Obj Destructuring
     return (
-      
       <div>
         <button onClick={onReset} className="btn btn-primary btn-sm m-2">
           Reset
@@ -47,9 +46,9 @@ class Counters extends Component {
         {this.props.counters.map((counter) => (
           <Counter
             key={counter.id}
+            counter={counter}
             onDelete={onDelete}
             onIncrement={onIncrement}
-            counter={counter}
             // value={counter.value}
             // id={counter.id}
           >