Deleting an object from an array on click of a button

Question

I am trying to create my own small Twitter.

It is all working fine but I cannot find a way to delete specific tweet on click of a button. I have tried splice() but it deletes the first object of an array always.

Here is my code:

var tweets = []

function postNewTweet() {

  var today = new Date();
  var date = today.getDate() + '-' + (today.getMonth() + 1) + '-' + today.getFullYear();
  var time = today.getHours() + ':' + today.getMinutes();
  var id = tweets.length + 1;
  var li = document.createElement('li');
  var inputValue = document.getElementById('newTweet').value;
  var finalValue = id + ' ' + inputValue + ' ' + date + ' ' + time;
  var t = document.createTextNode(finalValue);
  li.appendChild(t);
  tweets.push({
    id: id,
    content: inputValue,
    date: date + ' ' + time
  });
  document.getElementById('list').appendChild(li);
  document.getElementById('newTweet').value = "";
  console.log(tweets);

  var buttonDelete = document.createElement("button");
  buttonDelete.innerHTML = '<i class="far fa-trash-alt"></i>';
  buttonDelete.onclick = deleteItem;

  function deleteItem(e) {
    var ul = document.getElementById('list');
    ul.removeChild(li);

    var list = document.getElementById('list');
    list.addEventListener('click', function(e) {
      var index = e.target.getAttribute('value');
      tweets.splice(index, 1);
      console.log(tweets)
    });
  }
  li.appendChild(buttonDelete);
}

<div id='post'>
  <textarea maxlength="160" id='newTweet'></textarea>
  <button id='postIt' onclick="postNewTweet()">Post</button>
</div>

<ul id='list'>

</ul>

So it deletes it in HTML, but not in array correctly.

Answer 1

The second part of your deleteItem function's body seems useless. While there are couple of ways to resolve it, I suggest the following:

function deleteItem(e) {
    var ul = document.getElementById('list');
    ul.removeChild(li);

    var foundIndex = tweets.findIndex(function (tweet) {
        return tweet.id == id;
    });
    if (foundIndex > -1) {
        tweets.splice(foundIndex, 1);
    }
}