<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script type="text/javascript">
function setValues() {
document.getElementById('foo2').value = document.querySelector(".foo_name").textContent;
document.getElementById('bar2').value = document.querySelector(".bar_name").textContent;
document.getElementById('baz2').value = document.querySelector(".baz_name").textContent;
}
</script>
</head>
<body>
<div>
<form action="" method="get" onSubmit="return setValues()">
<input name="foo2" id="foo2" type="hidden">
<input name="bar2" id="bar2" type="hidden">
<input name="baz2" id="baz2" type="hidden">
<div>
<table>
<tbody>
<tr data-type="article">
<td class="foo_name" contenteditable="true" name="foo" id="foo">Foo Bar Baz<br>01.06.2014 - 31.12.2014</td>
<td class="bar_name" contenteditable="true" name="bar" id="bar">7 Baz</td>
<td class="baz_name" contenteditable="true" name="baz" id="baz">27 Baz</td>
</tr>
</tbody>
</table>
</div>
<button type="submit" id="submit">submit</button>
</form>
</div>
</body>
</html>