We Keep Coding

How to save data using jQuery?

I have some dynamic data in my <div> element. Look at the sample below:
<div>345</div>
<div>3245</div>
When I click on the div element, the nested value will change.
var someVar = $(this).find(div);
someVar.empty();
someVar.append("<div>Number has changed</div>");
Sample:
<div>345</div>
<div>Number has changed</div>
And when I click again on the div, I need to return the previous value:
<div>345</div>
<div>3245</div>
Here's the question: How do I keep this value for returning the number every time I click on the div with changed text inside of it?

you need create some data attribute store the previous value.The each time click get the data from attribute and restore the current text to attr like this data-prev.No need to append .html() is enought to toggle
updated
$('div').click(function(){
var prev=$(this).html();
$(this).html($(this).data('prev'));
$(this).data('prev',prev)
console.log($(this).data('prev'))
})
.nested{
color:red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>345</div>
<div data-prev="<div class='nested'>Number has changed</div>">3245</div>

You can use jQuery 'data' method.
$( "div" ).data( "number", 1 )
Then read it with:
( $( "div" ).data( "number" ) )
Documentation:
https://api.jquery.com/data/

JQuery: create array from element's name and create list

I would like to getElement's names => make an array => create a menu as list => add some clickbehaviour CSS. When exercising I already found a way to get all elements but could not reach their names.
The elements I am aiming for look like this <a class="jqsubmenu" name="ELEMENTSNAME"></a>.
The HTML-Code to be produced needs to be like <div id="#submenu"><ul>...</ul></div>. The <li> needs to look like <li>ELEMENTSNAME</li>. When a menu item is clicked any "active" classes in #submenu need to be removed and the clicked Anchor gets class="active".
Here are my results where I got stuck:
1) Get elements:
var optionTexts = [];
$("A.jqsubmenu").each(function() { optionTexts.push($(this).text()) });
2) make list (once I hopefully have an array) and write into DOM
var SubmenuArray = ['One', 'Two', 'Three'];
// GENERATE SUBMENU
var ObjUl = $('<div id="submenu"><ul></ul></div>');
for (i = 0; i < SubmenuArray.length; i++)
{
var Objli = $('<li></li>');
var Obja = $('ARRAYITEM');
} // WRITE INTO DOM
$('#submenuwrap').append(ObjUl);
}
3) CSS-Gimmick
$( document ).ready(function() {
$( "#submenu A" ).click(function( event ) {
$( "#submenu A" ).removeClass("active");
$( this ).addClass("active");
});
});
Thanks for your answers and all the best!

To access element's name attribute use
$("A.jqsubmenu").each(function() { optionTexts.push($(this).attr("name")) });

How to return link's value using jquery?

I have links with the following structure:
1.1
1.2
1.3
When the user clicks on this link, I would like to be able to return the correct link clicked and parse out the values before and after the '.'. Any advice on how to do this with jquery?
$('.loadpage').click(function(){
alert('test');
});

$('.loadpage').click(function(){
var vals = $(this).text().split('.');
});
jsFiddle example
For example, clicking the second links returns an array of ["1", "2"].

You can use this
$('.loadpage').click(function(){
console.log($(this).attr("href")); <--Logs the href
console.log($(this).attr("value")); <--Logs the value (is value a valid attr of a?)
console.log($(this).text()); <--Logs the link text
var parts = $(this).text().split("."); <--I believe you want this
});

$( '.loadpage' ).click( function(){
var
t = $( this ),
tv1 = t.text().split( '.' )[ 0 ],
tv2 = t.text().split( '.' )[ 1 ];
/*
now you have you values ready to use
*/
})

jQuery, Object has no method 'innerHtml'

I asked a question a bit back and got some useful advice. I am trying to make a sortable list that allows the user to add a youtube url to the list. I have it set to take the id and put it in an array, I then want it to use the following javascript to append the video url and a "cue" link to the list:
_videoId = _videoUrl.replace(/^[^v]+v.(.{11}).*/,"$1");
//place the Videoid in an array
_videoList[_videoList.length] = _videoId;
var $new_element = document.createElement('li');
//set the id of the li element to match it's position in the array
var refId = _videoList.length;
$new_element = $('li').attr('id', refId);
var $link = $('a')
.attr('href', _videoUrl)
.innerHtml(_videoUrl)
.data('refId', refId) // add parent li's id for reference in click event
.appendTo( $new_element )
.bind( 'click', function(){
cue( $link.data('refId') );
return false; // prevent browser's default click event
});
$new_element.appendTo( container );
However it is giving me an error (in chrome)
Object [object Object] has no method 'innerHtml'
my HTML looks like this:
<div id="hostPanel">
<div id="videoList">
<ul id="sortable">
</ul>
</div>
Any help on getting this to work could be nice.

innerHtml is a property of DOM-elements, not a method of jQuery-objects. Use html() instead.
Edit:
Regarding to the comment:
$new_element = $('li').attr('id', refId);
This doesn't create a new <li>-element, it takes the existing <li>-elements inside the document.
To create a new element in jQuery use
$new_element = $('<li/>').attr('id', refId);
It's the same here:
var $link = $('a')
...has to be
var $link = $('<a/>')
Don't mix jQuery and Javascript(DOM)
This is the Javascript(DOM)-way to create an element:
var $new_element = document.createElement('li');
jQuery expects markup for $() while the DOM-method createElement() expects a tagName as parameter .

How to remove div elements with Javascript?

Lets say I have a webpage, and all I'm interested is the div with id "content", i.e:
<div id="content"></div>
How do I remove all the other div elements, and just display the div I want?

var all_div_nodes = document.querySelectorAll('div'),
len = all_div_nodes.length,
current = null;
while( len-- ) {
current = all_div_nodes[len];
if( current.parentNode ) {
if( current .id !== 'content' )
current .parentNode.removeChild( current );
}
}
If you can afford using a library like jQuery, this would be even more trivial:
$('div').not('#content').remove();

If you want to remove the sibling DIVs, using jQuery, you can write:
$("#content").siblings("div").remove();