We Keep Coding

HTML button tag removal from backend

I have created a button dynamically in JavaScript and i am deleting the same when user clicks X symbol on it..
I am setting style.display=none to achieve this but the problem is in HTML there is space in it even after deleting the button. How can i delete the button without any space in HTML.
var x = document.getElementById(id);
x.style.display='none';

First of all, if you Google remove HTML element in javascript the first thing you see is this: How to remove an HTML element using Javascript?
and it works, but I'll pitch in my 2 cents anyways since that one uses parentElement, which is kinda outdated.
There's a .remove() method in javascript that lets you remove an html element.
It's as simple as:
var x = document.querySelector("#id");
x.remove();
but I doubt that will solve your issue, you might want to remove the parent element if it has a margin or padding like so:
var x = document.querySelector("#id");
x.parentElement.remove();
cheers

try it if u want to change the css
<script type="text/javascript">
$("#id").css('display', 'none');
</script>
or use it for add or remove the class. change the add to remove if want remove the class
<script type="text/javascript">
document.getElementById("submit").classList.add('disabled');
</script>

Finding $(this) after a function

So here's my problem: I'm using a function and I need the function to be specific to each tr with the class "middleone". It's supposed to change the insides of a div inside of the the tr with the class "middleone". But it's not working!
I know the recursive portion of it is working, and the "navigation" should be spot on, because even when i'm using just $(this) it doesn't do anything. When using document.getElementById it works fine but of course that only targets the first div and the full version of the code has to "Go here, pull from here, put it here, go to the next area, pull from here.. etc" Here's the testing code.
$('.middleone').each(function() {
var tripleeagain = $(this).find('div')
tripleeagain.innerHTML = "$";
});
Thanks for any help

tripleeagain is a jquery object collection upon which you should use html() instead of innerHTML
Basically you could just write:
$('.middleone').find('div').html("$");
If you are doing specific stuff inside the loop then:
$('.middleone').each(function() {
//Some specific logic
var tripleeagain = $(this).find('div').html("$");
});

The problem is you are trying to access native API from a jQuery object.
var tripleeagain = $(this).find('div');// this will return a jQuery object
So you should use the jQuery API for setting the html contents
tripleeagain.html("$");
jQuery html API documentaion

How to remove a class via JavaScript (NOT jQuery) at Wordpress

I need your help at a problem of my Wordpress Webpage. My Wordpress-page is an Single-Page-App with 3 different boxes of content. The left and center boxes are static, the right one changes its content by clicking on links of the other boxes. I decided, to load all the content in the right box and show them with the CSS-command visibility. With a combination of pathJS and JS, i want the URL to change by clicking on the links. So far so good - all works fine, but i dont get managed via my JS-Function to remove the shown-class.
My script looks like this:
<script>
function showDetailContent(showid) {
//suche objekt right_id -> was du zeigen willst -> getelementbyid
alert("1");
var id = document.getElementsByClassName('shown');
alert("2");
id.classList.remove('shown');
alert("3");
document.getElementByID("right_" + showid).classList.add('shown');
alert("4");
}
//var c = document.getElementById('content'); -->do the function :)
Path.map("#/?p=<?php the_id();?>").to(function () {
showDetailContent(<?php the_id();?>);
});
Path.listen();
</script>
The alerts are just my way of "debugging". I think its not the best way to debugg, but i am very new in the world of prorgamming and this is kind of easy.
However, the first two alerts are shown, if i activate a link. So the (first) mistake is on the line
id.classList.remove('shown');
Normally, the right-box is hidden, so that only one content is load.
Do you understand my problem till here?
I would appreciate fast help!
Greetings, Yannic! :)

Look at this : http://snipplr.com/view/3561/ to know remove class pure javascript

getElementsByClassName gets multiple elements, try:
var id = document.getElementsByClassName('shown')[0];
Or iterate through them if you want to remove class from all elements with class shown;

Create own numpad with inputs

I've been searching the web for some tips regarding how to make your own numpad, created with html code, to act as a numpad would on the computer.
I have this numpad on my website that would give an input to a textfield in the same div. I've given a value to each button and now I guess I would have to create something more so that the numbers will add to my text field.
I'm really a beginner with programming so maybe this is really easy. Thanks for the help!

You could do it, alternatively, with jQuery. jQuery is better IMHO if you need a simple easy solution (jQuery is generally easier and faster).
HTML:
<div id="myDiv"> </div> //the div to which we add text
<div id="buttonContainer"> //this is the div containing the numbers (the numpad)
<button value="one"> one </button>
<button value="two"> two </button>
</div>
jQuery:
$("#buttonContainer button").click(function() {
$("#myDiv").append($(this).val());
});
http://jsfiddle.net/DLzUU/1/
What this does is: when you click any button inside the div with id of 'buttonContainer', it adds its value to the div with the id of "myDiv".
On the Javascript subject, if you want a VERY good guide: http://javascript.info/

what you need is to learn javascript. With javascript you will be able to write code to do this.
<script>
function AddValueToTextField(val)
{
document.getElementByID( <textfiled ID> ).value += val;
}
</script>
<button onClick="AddValueToTextField(this.value)"></button>
this is only very basic but it is a rough idea of what is needed, the button is set to call the function "AddValueToTextField" when it is clicked. When the function is called the value of the button is sent along with it. Inside the function it gets a handle on the textfield and adds the value of the button to whatever was already there, I'd suggest looking at:
http://www.w3schools.com/js/
as a place to start learning javascript.

you can try http://keith-wood.name/keypad.htmlkeypad example, this is an awesome example

$(document).ready(function(){
var selected;
$(".admin_loginid input").focus(function(){
selected = $(this);
});
$(".loginbtn").click(function(){
selected.val(selected.val() + $(this).val());
});
});
Solved it that way and it works really well, thanks for the help! Now my selected input box takes the input from the numpad that i've created.

Adding a dynamically created div to another div with jquery

I am creating two divs:
var div_day=document.createElement("div");
var div_dateValue=document.createElement("div");
I then want to add div_day to an existing calendar div and div_dateValue to div_day:
$('#calendar').append(div_day)
$(div_day).append(div_dateValue);
div_day gets added to calendar, but div_dateValue does not get added to div_day, and the script stops there. No errors in the console but it is in a loop and should have more div_days (each with a unique id). I am new to jquery so any help is appreciated.
In my search I have found how to add divs, but not to add a dynamically created div to another dynamically created div.
Thanks for your help!
Kevin

div_day.appendChild(div_dateValue)
$('#calendar').append(div_day)

Something else must be going on (even with your missing semi-colon). Your example works fine here:
http://jsfiddle.net/P4rh5/
But, instead of creating divs with straight javascript, you can do it with jQuery:
var div_day = $("<div>");
var div_dateValue = $("<div>");
$('#calendar').append(div_day);
$(div_day).append(div_dateValue);
Of course, you could do this in a single step:
$('#calendar').append("<div><div></div></div>");

$('<div><div></div></div>').appendTo("#calendar");
Try this and mark it as answer if it helps