How to add , edit and delete element with jQuery

I have a button named "Create", so I want when I click "Create" something like below elements created.

<div class="parents">
        <input type="radio" class="r-btn">
        <a class="edit"> New</a>
</div>

Now when I click on "New" then input type change to text and also these two button are added to the codes, like this:

<div class="parents">
        <input type="text" class="r-btn">
        <a class="edit"> New</a>
        <button class="save">Save</button>
        <button class="delete">Delete</button>
</div>

Now if I click delete button div.parents with all child deleted and if I click on save button then input value should be replaced with "New" text.

Of course if I have more than one div.parents then only the button I clicked on, has to be deleted with its parent, not others.